@charset "UTF-8";

.result-first__teller__bg-img-parent {
  width: 100%;
  position: relative;
  margin: 0 auto;
}

.result-first__teller__bg-img-parent img.teller-position-right {
  width: 70%;
  display: block;
  margin: 0 0 0 auto;
}

.result-first__teller__bg-img-parent div.teller-message-box-parent {
  width: 100%;
  height: 100%;
  padding-left: 4%;
  line-height: 1.7;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-weight: bold;
}

.result-first__teller__bg-img-parent div.teller-message-box-parent p {
  width: 61%;
  max-height: 100%;
  padding: 0.5rem;
  background-color: rgba(255, 255, 255, 0.5490196078);
}

.pre__title__center.second_recommend_title {
  margin-bottom: 2rem;
  margin-top: 4rem;
}

.header {
  width: 100%;
  height: 3rem;
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/common/navigation_head.jpg");
  background-size: 100% 100%;
}

.header img {
  width: auto;
  height: 100%;
}

.sub-menu-000 {
  width: 100%;
}

.sub-menu-001 {
  width: 100%;
}

.sub-menu-002 {
  width: 100%;
}

.sub-menu-003 {
  width: 100%;
}

.sub-menu-004 {
  width: 100%;
}

.sub-menu-005 {
  width: 100%;
}

.subMenu005__title {
  margin: 5% auto;
}

.subMenu005__result {
  width: 95%;
  margin: 0 auto;
}

.subMenu005__result__head {
  position: relative;
}

.subMenu005__result__head__img {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translateX(-50%);
  width: 30%;
}

.subMenu005__result__body {
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/member/omikuji/bg.jpg");
  background-size: 100%;
  background-repeat: repeat-y;
  padding: 5% 8% 0;
}

.subMenu005__result__body__separate-text {
  border: 2px solid #ba2538;
  padding: 2% 5%;
  line-height: 1.5;
  margin-bottom: 10%;
}

.subMenu005__result__body__text {
  writing-mode: vertical-rl;
  margin: 0 auto;
  line-height: 1.5;
  font-size: 120%;
  font-weight: bold;
}

.sub-menu-006 {
  width: 100%;
}

.sub-menu-006__tarot {
  position: relative;
  overflow: hidden;
}

.sub-menu-006__tarot__spread {
  width: 100%;
  transform: scale(0);
}

.sub-menu-006__tarot__spread.showTarot {
  transform: scale(1);
}

.sub-menu-006__tarot__cards {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.sub-menu-006__tarot__cards div {
  width: 100%;
  height: 100%;
  position: relative;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(1) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(1).hide {
  opacity: 0;
  top: 3%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(1).order {
  top: 3%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(8) {
  position: absolute;
  width: 29%;
  top: 2.5%;
  left: 35.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(8).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(15) {
  position: absolute;
  width: 29%;
  top: 2.5%;
  left: 35.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(15).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(2) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(2).hide {
  opacity: 0;
  top: 17.7%;
  left: 62.6%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(2).order {
  top: 17.7%;
  left: 62.6%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(9) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 62.7%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(9).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(16) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 62.7%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(16).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(3) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(3).hide {
  opacity: 0;
  top: 51.5%;
  left: 62.6%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(3).order {
  top: 51.5%;
  left: 62.6%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(10) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 62.7%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(10).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(17) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 62.7%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(17).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(4) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(4).hide {
  opacity: 0;
  top: 66.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(4).order {
  top: 66.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(11) {
  position: absolute;
  width: 29%;
  top: 65.3%;
  left: 35.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(11).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(18) {
  position: absolute;
  width: 29%;
  top: 65.3%;
  left: 35.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(18).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(5) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(5).hide {
  opacity: 0;
  top: 51.5%;
  left: 8%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(5).order {
  top: 51.5%;
  left: 8%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(12) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 7.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(12).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(19) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 7.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(19).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(6) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(6).hide {
  opacity: 0;
  top: 17.5%;
  left: 8%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(6).order {
  top: 17.5%;
  left: 8%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(13) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 7.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(13).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(20) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 7.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(20).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(7) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  opacity: 1;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(7).hide {
  opacity: 0;
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__back:nth-child(7).order {
  top: 34.5%;
  left: 35.4%;
  transform: rotate(0deg) skew(0deg, 0deg);
  z-index: 1;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(14) {
  position: absolute;
  width: 29%;
  top: 34.3%;
  left: 35.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light__effect:nth-child(14).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 1.5s;
  animation-iteration-count: inherit;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(21) {
  position: absolute;
  width: 29%;
  top: 34.3%;
  left: 35.6%;
  opacity: 0;
  transition: all 700ms;
}

.sub-menu-006__tarot__cards div .sub-menu-006__tarot__cards__light:nth-child(21).show {
  opacity: 1;
  animation-name: scale-up-with-fadeout-keep;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.sub-menu-006__sub-menu-title {
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-006__sub-menu-title.show {
  opacity: 1;
}

.sub-menu-006__sub-menu-title.hide {
  margin: 0 auto;
  padding: 0;
}

.sub-menu-006__pickup {
  width: 80%;
  margin: 0 10%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-006__pickup img {
  opacity: 0;
}

.sub-menu-006__pickup img.show {
  opacity: 1;
}

.sub-menu-006__pickup.show {
  opacity: 1;
}

.sub-menu-006__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-006__text.show {
  opacity: 1;
}

.sub-menu-006__text.hide {
  margin: 0 auto;
}

@keyframes scale-up-with-fadeout {
  0% {
    opacity: 0;
    transform: scale(0);
  }

  20% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(3);
  }
}

@keyframes scale-up-with-fadeout-keep {
  0% {
    opacity: 0;
    transform: scale(0.8);
  }

  25% {
    opacity: 1;
    transform: scale(1.1);
  }

  50% {
    opacity: 0;
    transform: scale(1);
  }

  75% {
    opacity: 1;
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.sub-menu-007 {
  width: 100%;
  word-break: break-all;
  overflow: hidden;
}

.sub-menu-007__title {
  position: relative;
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 95%;
  font-weight: bold;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33\FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671DPro W3", "Hiragino Mincho Pro", serif;
  display: flex;
  align-items: center;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
  height: 0%;
}

.sub-menu-007__title.show {
  animation: text-007 1s forwards ease;
}

.sub-menu-007__title.hide {
  margin: 0 auto;
  padding: 0;
}

.sub-menu-007__graph {
  width: 95%;
  margin: 0 auto;
  position: relative;
}

.sub-menu-007__graph img {
  width: 100%;
}

.sub-menu-007__graph__images {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.sub-menu-007__graph__images img {
  width: 100%;
  position: absolute;
}

.sub-menu-007__graph__images img:nth-child(1) {
  width: 50%;
  margin: auto;
  left: 0;
  right: 0;
  top: 0%;
  bottom: 0;
}

.sub-menu-007__graph__images img:nth-child(2) {
  right: 0;
  top: 10%;
  left: 6%;
}

.sub-menu-007__graph__images img:nth-child(3) {
  left: 0%;
}

.sub-menu-007__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
  height: 0%;
}

.sub-menu-007__text.show {
  animation: text-007 1s forwards ease;
}

.sub-menu-007__text.hide {
  margin: 0 auto;
}

.sub-menu-007__graph__images {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.sub-menu-007__graph__images__animation {
  width: 100%;
  height: 0%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.sub-menu-007__graph__images .extend {
  opacity: 1;
  height: 100%;
  animation: extend-image 2s forwards ease;
}

@keyframes extend-image {
  0% {
    top: 0%;
    clip-path: inset(0 0 100% 0);
  }

  100% {
    top: 0%;
    clip-path: inset(0);
  }
}

@keyframes text-007 {
  0% {
    opacity: 0;
    height: 0%;
  }

  100% {
    opacity: 1;
    height: 100%;
  }
}

.sub-menu-007__graph__images img {
  width: 100%;
  position: absolute;
}

.sub-menu-007__graph__images img:nth-child(1) {
  width: 100%;
  margin: auto;
  left: 6%;
  right: 0;
  top: 0%;
  bottom: 0;
}

.sub-menu-007__graph__images img:nth-child(2) {
  right: 0;
  top: 10%;
  left: 6%;
}

.sub-menu-007__graph__images img:nth-child(3) {
  left: 0%;
}

.sub-menu-008 {
  width: 100%;
}

.sub-menu-008__title {
  position: relative;
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 95%;
  font-weight: bold;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33\FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671DPro W3", "Hiragino Mincho Pro", serif;
  display: flex;
  align-items: center;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
  height: 0%;
}

.sub-menu-008__title.show {
  animation: text-007 1s forwards ease;
}

.sub-menu-008__title.hide {
  margin: 0 auto;
  padding: 0;
}

.sub-menu-008__answer-message {
  position: relative;
}

.sub-menu-008__answer-message img {
  width: 100%;
}

.sub-menu-008__answer-message__absolute-parent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.sub-menu-008__answer-message__absolute-parent__relative-parent {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-008__answer-message__absolute-parent__relative-parent div.window {
  position: absolute;
  width: 60%;
  top: 10%;
  left: 0%;
}

.sub-menu-008__answer-message__absolute-parent__relative-parent div.window .text {
  display: flex;
  align-items: center;
  text-align: left;
  padding: 2%;
  margin: 7% 0% 0% 5%;
  min-height: 7rem;
  border: 1px solid black;
  border-radius: 14px;
  font-size: 100%;
  line-height: 150%;
  color: white;
  background-color: rgba(0, 0, 0, 0.6392156863);
  box-shadow: 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff;
  font-family: "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-008__answer-message__absolute-parent__relative-parent div.window .text span {
  font-size: 115%;
  font-weight: bold;
  word-break: break-all;
}

.sub-menu-008__answer-message__absolute-parent__relative-parent div.window .text_free151 {
  padding: 8% 0%;
  text-align: center;
  margin: 7% 0% 0% 5%;
  min-height: 7rem;
  border: 1px solid black;
  border-radius: 14px;
  font-size: 100%;
  line-height: 150%;
  color: white;
  background-color: rgba(0, 0, 0, 0.6392156863);
  align-items: center;
  box-shadow: 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff;
  font-family: "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-008__answer-message__absolute-parent__relative-parent div.window .text_free151 span {
  font-size: 115%;
  font-weight: bold;
  word-break: break-all;
}

.sub-menu-008__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
  height: 0%;
}

.sub-menu-008__text.show {
  animation: text-007 1s forwards ease;
}

.sub-menu-008__text.hide {
  margin: 0 auto;
}

.sub-menu-008__extend {
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: height 0.6s ease, opacity 0.6s ease;
}

.sub-menu-008__extend.open {
  opacity: 1;
}

.sub-menu-009 {
  width: 100%;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-009__direction {
  position: relative;
}

.sub-menu-009__direction img {
  width: 100%;
}

.sub-menu-009__direction__text-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  text-align: center;
}

.sub-menu-009__direction__text-wrap div {
  position: relative;
}

.sub-menu-009__direction__text-wrap div div {
  width: 59%;
  position: absolute;
  left: 2%;
  margin-top: 2rem;
  background-color: rgba(255, 255, 255, 0.7607843137);
  border-radius: 13px;
  padding: 1rem 4%;
}

.sub-menu-010 {
  width: 100%;
}

.sub-menu-010__recommend-text-box {
  width: 100%;
}

.sub-menu-010__recommend-text-box__text {
  width: 100%;
  margin: 20px auto;
  font-size: 100%;
  line-height: 150%;
  text-align: center;
  font-weight: bold;
  text-shadow: 4px 2px 5px white;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-010__recommend-text-box__text .result_text_css {
  font-weight: bold;
  color: orange;
}

.sub-menu-011 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-011__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-011__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-011__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-011__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-011__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-011__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-011__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-011;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-011__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-011__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-011;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-011__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
  scale: 0.8;
}

.sub-menu-011__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-011__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-011__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-011__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-011__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-011__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
}

.sub-menu-011__motif-text.show {
  opacity: 1;
  line-height: 1.2rem;
}

.sub-menu-011__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-011__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-011 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-011 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-011a {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-011a__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-011a__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-011a__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-011a__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-011a__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-011a__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-011a__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-011;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-011a__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-011a__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-011;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-011a__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
  transform: scale(0.8);
}

.sub-menu-011a__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
  transform: scale(1);
}

.sub-menu-011a__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-011a__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-011a__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-011a__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-011a__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-011a__motif-text.show {
  opacity: 1;
  line-height: 1.2rem;
}

.sub-menu-011a__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-011a__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-011 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-011 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-011b {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-011b__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-011b__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-011b__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-011b__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-011b__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-011b__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-011b__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-011;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-011b__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-011b__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-011;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-011b__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
  transform: scale(0.8);
}

.sub-menu-011b__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
  transform: scale(1);
}

.sub-menu-011b__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-011b__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-011b__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-011b__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-011b__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-011b__motif-text.show {
  opacity: 1;
  line-height: 1.2rem;
}

.sub-menu-011b__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-011b__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-011 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-011 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-012 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-012__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-012__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-012__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-012__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-012__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-012__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-012__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-012;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-012__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-012__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-012;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-012__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
}

.sub-menu-012__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-012__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-012__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-012__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-012__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-012__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-012__motif-text.show {
  opacity: 1;
}

.sub-menu-012__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-012__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-012 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-012 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-012a {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-012a__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-012a__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-012a__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-012a__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-012a__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-012a__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-012a__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-012;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-012a__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-012a__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-012;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-012a__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
  transform: scale(0.8);
}

.sub-menu-012a__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
  transform: scale(1);
}

.sub-menu-012a__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-012a__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-012a__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-012a__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-012a__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-012a__motif-text.show {
  opacity: 1;
}

.sub-menu-012a__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-012a__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-012 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-012 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-013 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro";
}

.sub-menu-013__shadow-white {
  text-shadow: white 2px 0px 2px, white -2px 0px 2px, white 0px -2px 2px, white -2px 0px 2px, white 2px 2px 2px, white -2px 2px 2px, white 2px -2px 2px, white -2px -2px 2px, white 1px 2px 2px, white -1px 2px 2px;
}

.sub-menu-013__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-013__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-013__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-013__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-013__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-013__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-013__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-013;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-013__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-013__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-013;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-013__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
}

.sub-menu-013__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-013__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-013__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-013__motif-text {
  width: 85%;
  margin: 0 auto;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-013__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-013__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-013__motif-text.show {
  opacity: 1;
}

.sub-menu-013__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-013__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-013 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-013 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-014 {
  width: 100%;
}

.sub-menu-014__title {
  position: relative;
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 95%;
  font-weight: bold;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33\FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671DPro W3", "Hiragino Mincho Pro", serif;
  display: flex;
  align-items: center;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
  height: 0%;
}

.sub-menu-014__title.show {
  animation: text-007 1s forwards ease;
}

.sub-menu-014__tarot {
  position: relative;
}

.sub-menu-014__tarot__spread {
  width: 80%;
  margin: 0 10%;
}

.sub-menu-014__tarot__cards {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.sub-menu-014__tarot__cards div {
  width: 100%;
  height: 100%;
  position: relative;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(1) {
  position: absolute;
  width: 21%;
  top: 1%;
  left: 39.6%;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(2) {
  position: absolute;
  width: 21%;
  top: 14%;
  left: 58.5%;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(3) {
  position: absolute;
  width: 21%;
  top: 47.5%;
  left: 58.5%;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(4) {
  position: absolute;
  width: 21%;
  top: 65.5%;
  left: 39.6%;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(5) {
  position: absolute;
  width: 21%;
  top: 47.5%;
  left: 20%;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(6) {
  position: absolute;
  width: 21%;
  top: 14.5%;
  left: 20%;
}

.sub-menu-014__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(7) {
  position: absolute;
  width: 21%;
  top: 33%;
  left: 39.6%;
}

.sub-menu-014__pickup {
  width: 80%;
  margin: 0 10%;
  overflow: hidden;
  position: relative;
}

.sub-menu-014__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  overflow: hidden;
}

.sub-menu-014__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
  height: 0%;
}

.sub-menu-014__text.show {
  animation: text-007 1s forwards ease;
}

.sub-menu-014-front-card1 {
  transition: all 1.5s;
  transform-origin: 25% 50%;
  clip-path: inset(0 50% 0 0);
  transform: rotateY(-180deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.sub-menu-014-front-card1.show {
  transform: rotateY(0deg);
}

.sub-menu-014-front-card2 {
  transition: all 1.5s;
  clip-path: inset(0 0 0 50%);
  position: absolute;
  top: 0%;
  left: 0%;
  transform-origin: 75% 50%;
  transform: rotateY(-180deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.sub-menu-014-front-card2.show {
  transform: rotateY(0deg);
}

.shadow-box3 {
  position: absolute;
  top: 7%;
  left: 4.8%;
  width: 42%;
  height: 87%;
  border-radius: 3%;
  z-index: 3;
  opacity: 0;
}

.shadow-box3.bright {
  animation: sublight 1s ease-in-out;
}

.shadow-box4 {
  position: absolute;
  top: 7%;
  left: 53%;
  width: 42%;
  height: 87%;
  z-index: 3;
  opacity: 0;
}

.shadow-box4.bright {
  animation: sublight 1s ease-in-out;
}

@keyframes sublight {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(3);
  }

  100% {
    opacity: 0;
  }
}

.shadow-box1 {
  position: absolute;
  top: 7%;
  left: 0%;
  width: 48%;
  height: 86.5%;
  border-radius: 3%;
}

.shadow-box2 {
  position: absolute;
  top: 7%;
  left: 52%;
  width: 48%;
  height: 86.5%;
  border-radius: 3%;
}

.shadow-box1,
.shadow-box2 {
  transition: all 1.5s;
  opacity: 1;
  transform: scale(1);
  background: var(--tarot-bg) center/cover no-repeat;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.shadow-box1.show,
.shadow-box2.show {
  transform: rotateY(180deg);
}

@keyframes flash-light-img {
  0% {
    background: var(--tarot-bg) center/cover no-repeat;
    opacity: 1;
  }

  90% {
    background: var(--tarot-bg) center/cover no-repeat;
    opacity: 1;
  }

  100% {
    opacity: 0;
    background: rgba(0, 0, 0, 0);
  }
}

.sub-menu-015 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-015__emperor-sign {
  position: relative;
  overflow: hidden;
}

.sub-menu-015__emperor-signimg:nth-child(1) {
  width: 100%;
}

.sub-menu-015__emperor-sign__images {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.sub-menu-015__emperor-sign__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-015__emperor-sign__images__outline img:nth-child(1) {
  width: 58%;
  margin: 0 auto;
  position: absolute;
  opacity: 0;
  transition: all 700ms;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.sub-menu-015__emperor-sign__images__outline img:nth-child(1).show {
  opacity: 1;
}

.sub-menu-015__emperor-sign__images__outline img:nth-child(2) {
  width: 58%;
  margin: 0 auto;
  position: absolute;
  opacity: 0;
  transition: all 700ms;
  top: 0;
  right: 0;
  transform: rotateY(-180deg);
}

.sub-menu-015__emperor-sign__images__outline img:nth-child(2).show {
  opacity: 1;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign {
  width: 50%;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div {
  position: relative;
  transition: all 1000ms;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div.slide {
  transform: translateX(-47%);
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div img:nth-child(1) {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div img:nth-child(1).show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div img:nth-child(2) {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div img:nth-child(2).show {
  animation-name: scale-up-with-fadeout-for-light;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div img:nth-child(3) {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
}

.sub-menu-015__emperor-sign__images__outline__emperor-sign div img:nth-child(3).show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-015__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-015__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-015__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-015__motif-text.show {
  opacity: 1;
}

.sub-menu-015__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-015__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

.sub-menu-016 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-016__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-016__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-016__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
}

.sub-menu-016__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-016__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-016__emperor-sign-new__images__outline__left {
  top: 0;
  left: -19%;
  width: 50%;
}

.sub-menu-016__emperor-sign-new__images__outline__right {
  top: 0;
  left: 69%;
  width: 50%;
}

.sub-menu-016__emperor-sign-new__motif {
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
}

.sub-menu-016__emperor-sign-new__motif-text {
  width: 100%;
  padding: 3% 0;
}

.sub-menu-016__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
}

.sub-menu-016__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-016__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-016__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
}

.sub-menu-017 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-017__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-017__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-017__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
}

.sub-menu-017__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-017__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-017__emperor-sign-new__images__outline__left {
  top: 0;
  left: -19%;
  width: 50%;
}

.sub-menu-017__emperor-sign-new__images__outline__right {
  top: 0;
  left: 69%;
  width: 50%;
}

.sub-menu-017__emperor-sign-new__motif {
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
}

.sub-menu-017__emperor-sign-new__motif-text {
  width: 100%;
  padding: 3% 0;
}

.sub-menu-017__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
}

.sub-menu-017__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-017__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-017__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
}

.sub-menu-018 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro";
}

.sub-menu-018__shadow-white {
  text-shadow: white 2px 0px 2px, white -2px 0px 2px, white 0px -2px 2px, white -2px 0px 2px, white 2px 2px 2px, white -2px 2px 2px, white 2px -2px 2px, white -2px -2px 2px, white 1px 2px 2px, white -1px 2px 2px;
}

.sub-menu-018__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-018__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-018__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
}

.sub-menu-018__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-018__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-018__emperor-sign-new__images__outline__left {
  top: 0;
  left: -19%;
  width: 50%;
}

.sub-menu-018__emperor-sign-new__images__outline__right {
  top: 0;
  left: 69%;
  width: 50%;
}

.sub-menu-018__emperor-sign-new__motif {
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
}

.sub-menu-018__emperor-sign-new__motif-text {
  width: 100%;
  padding: 3% 0;
}

.sub-menu-018__motif-text {
  width: 85%;
  margin: 0 auto;
}

.sub-menu-018__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-018__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-018__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
}

.sub-menu-019 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-019__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-019__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-019__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
}

.sub-menu-019__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-019__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-019__emperor-sign-new__images__outline__left {
  top: 0;
  left: -19%;
  width: 50%;
}

.sub-menu-019__emperor-sign-new__images__outline__right {
  top: 0;
  left: 69%;
  width: 50%;
}

.sub-menu-019__emperor-sign-new__motif {
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
}

.sub-menu-019__emperor-sign-new__motif-text {
  width: 100%;
  padding: 3% 0;
}

.sub-menu-019__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
}

.sub-menu-019__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-019__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-019__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
}

.sub-menu-020__text {
  text-align: center;
  font-size: 160%;
  font-weight: bold;
  color: #C13311;
  background: white;
  padding: 0.5em 1em;
  margin: 7%;
  line-height: 170%;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.33);
}

.sub-menu-020__mosaic {
  width: 80%;
}

.sub-menu-021 {
  width: 100%;
}

.sub-menu-021__tarot {
  position: relative;
}

.sub-menu-021__tarot__spread {
  width: 80%;
  margin: 0 10%;
}

.sub-menu-021__tarot__cards {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.sub-menu-021__tarot__cards div {
  width: 100%;
  height: 100%;
  position: relative;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(1) {
  position: absolute;
  width: 21%;
  top: 1%;
  left: 39.6%;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(2) {
  position: absolute;
  width: 21%;
  top: 14%;
  left: 58.5%;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(3) {
  position: absolute;
  width: 21%;
  top: 47.5%;
  left: 58.5%;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(4) {
  position: absolute;
  width: 21%;
  top: 65.5%;
  left: 39.6%;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(5) {
  position: absolute;
  width: 21%;
  top: 47.5%;
  left: 20%;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(6) {
  position: absolute;
  width: 21%;
  top: 14.5%;
  left: 20%;
}

.sub-menu-021__tarot__cards div .sub-menu-014__tarot__cards__light:nth-child(7) {
  position: absolute;
  width: 21%;
  top: 33%;
  left: 39.6%;
}

.sub-menu-021__pickup {
  width: 80%;
  margin: 0 10%;
  overflow: hidden;
}

.sub-menu-021__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  overflow: hidden;
}

.sub-menu-022 {
  width: 100%;
  margin-top: 5%;
}

.sub-menu-022__body {
  text-align: center;
}

.sub-menu-023__emperor-sign {
  display: flex;
  align-items: center;
  justify-content: center;
}

.sub-menu-023__emperor-sign__img {
  width: 35%;
}

.sub-menu-023__emperor-sign__img > p {
  text-align: center;
}

.sub-menu-023__emperor-sign__cross {
  display: block;
  position: relative;
  width: 20%;
}

.sub-menu-023__emperor-sign__cross::before,
.sub-menu-023__emperor-sign__cross::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 50px;
  background: #333;
}

.sub-menu-023__emperor-sign__cross::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.sub-menu-023__emperor-sign__cross::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.sub-menu-024 {
  width: 100%;
}

.sub-menu-024__genmei {
  width: 80%;
  margin: 5% auto;
}

.sub-menu-024 .result__sub__menu__text span:nth-child(1) {
  color: #c00000;
}

.sub-menu-025 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-025__container {
  width: 100%;
  margin: 5% auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sub-menu-025__container__motif-card {
  opacity: 0;
  transition: all 1s;
  width: 50%;
  top: 10%;
  left: 25%;
}

.sub-menu-025__container__motif-card.show {
  opacity: 1;
}

.sub-menu-025 .result__sub__menu__text {
  opacity: 0;
  transition: all 1s;
}

.sub-menu-025 .result__sub__menu__text.show {
  opacity: 1;
}

.sub-menu-026 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-026__container {
  position: relative;
  width: 100%;
  height: 63vw;
}

.sub-menu-026__container__motif-card {
  position: absolute;
  transition: all 1.5s;
  width: 50%;
  top: 0;
  left: 25%;
  transform: rotateY(-180deg);
  backface-visibility: hidden;
}

.sub-menu-026__container__motif-card.show {
  transform: rotateY(0deg);
}

.sub-menu-026__container__back-card {
  position: absolute;
  transition: all 1.5s;
  width: 58%;
  top: -11px;
  left: 21%;
  backface-visibility: hidden;
}

.sub-menu-026__container__back-card.show {
  transform: rotateY(180deg);
}

.sub-menu-027 {
  width: 100%;
  overflow: hidden;
  padding: 0 2%;
}

.sub-menu-027 .result__sub__menu__text {
  background-color: rgba(249, 244, 237, 0.5411764706);
  font-size: 100%;
  width: 90%;
  padding: 1rem;
}

.sub-menu-028 {
  width: 100%;
  overflow: hidden;
  padding: 0 2%;
}

.sub-menu-028 .result__sub__menu__text {
  background-color: rgba(249, 244, 237, 0.5411764706);
  font-size: 100%;
  width: 90%;
  padding: 1rem;
}

.sub-menu-029 {
  width: 100%;
  overflow: hidden;
  padding: 0 2%;
}

.sub-menu-029 .result__sub__menu__text {
  background-color: rgba(249, 244, 237, 0.5411764706);
  font-size: 100%;
  width: 90%;
  padding: 1rem;
}

.sub-menu-030 {
  width: 100%;
  overflow: hidden;
  padding: 0 2%;
}

.sub-menu-030 .result__sub__menu__text {
  background-color: rgba(249, 244, 237, 0.5411764706);
  font-size: 100%;
  width: 90%;
  padding: 1rem;
}

.sub-menu-031 {
  width: 100%;
  overflow: hidden;
  padding: 0 2%;
}

.sub-menu-031 .result__sub__menu__text {
  background-color: rgba(249, 244, 237, 0.5411764706);
  font-size: 100%;
  width: 90%;
  padding: 1rem;
}

.sub-menu-032 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-032__motif {
  opacity: 0;
  transition: all 1s;
  padding: 0 5%;
}

.sub-menu-032__motif.show {
  opacity: 1;
}

.sub-menu-033 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-033__motif {
  opacity: 0;
  transition: all 1s;
  padding: 0 5%;
}

.sub-menu-033__motif.show {
  opacity: 1;
}

.sub-menu-034 {
  width: 100%;
  overflow: hidden;
  margin-bottom: 0%;
  padding: 0 2%;
}

.sub-menu-034__container {
  position: relative;
  width: 100%;
}

.sub-menu-034__container__background {
  width: 100%;
}

.sub-menu-034__container__flash {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 50%;
  top: 20%;
  left: 27%;
}

.sub-menu-034__container__flash.move {
  transform: scale(1.5);
  opacity: 1;
}

.sub-menu-034__container__flash.out {
  opacity: 0;
}

.sub-menu-034__container__age {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 16%;
  top: 15.5%;
  left: 14.5%;
}

.sub-menu-034__container__age.show {
  opacity: 1;
}

.sub-menu-034__container__season {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 12.3%;
  top: 14.9%;
  left: 30.5%;
}

.sub-menu-034__container__season.show {
  opacity: 1;
}

.sub-menu-034__container__guardian {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 53.5%;
  top: 14.5%;
  left: 44%;
}

.sub-menu-034__container__guardian.show {
  opacity: 1;
}

.sub-menu-034__container__frame {
  position: absolute;
  transition: all 1s;
  height: 100%;
  width: 100%;
  top: 0%;
  left: 0%;
}

.sub-menu-034__container__frame__row1 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 15%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row2 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 22%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row3 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 29%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row4 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 36.5%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row5 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 43.5%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row6 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 50.5%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row7 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 57.8%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row8 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 64.8%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row9 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 71.8%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row10 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 79.2%;
  left: 3.2%;
}

.sub-menu-034__container__frame__row11 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 86.2%;
  left: 3.2%;
}

.sub-menu-034 .result__sub__menu__text {
  font-size: 100%;
  font-weight: bold;
}

.frame-yellow {
  opacity: 0;
  box-shadow: 0 0 10px #f9ff54 inset, 1px -1px 10px #f9ff54, -1px 1px 10px #f9ff54, -1px 1px 10px #f9ff54, 1px -1px 10px #f9ff54;
  outline: solid 1px #f9ff54;
  transform: scale(1.5);
  transition: all 600ms;
}

.frame-yellow.show {
  opacity: 1;
  transform: scale(1);
}

.sub-menu-035 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-035__text {
  text-align: center;
  font-size: 100%;
  font-weight: bold;
  line-height: 150%;
  margin: 0% auto 5%;
}

.sub-menu-035__container {
  position: relative;
  width: 100%;
}

.sub-menu-035__container__background {
  width: 100%;
  padding: 0 2%;
}

.sub-menu-035__container__flash {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 50%;
  top: 15%;
  left: 25%;
}

.sub-menu-035__container__flash.move {
  transform: scale(2);
  opacity: 1;
}

.sub-menu-035__container__flash.out {
  opacity: 0;
}

.sub-menu-035__container__age {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  top: 34%;
  left: 32%;
  color: #782300;
  font-size: 17.5vw;
}

.sub-menu-035__container__age.show {
  opacity: 1;
}

.sub-menu-035__container__date {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  top: 74%;
  left: 20%;
  color: #2e3d7d;
  font-size: 110%;
  font-weight: bold;
}

.sub-menu-035__container__date.show {
  opacity: 1;
}

.sub-menu-035__container__text {
  position: absolute;
  top: 13%;
  left: 23%;
  font-size: 100%;
  font-weight: bold;
}

.sub-menu-035__container__text span {
  color: #2e3d7d;
  font-size: 7vw;
  margin: 0 3px;
}

.sub-menu-035 .text-shadow {
  text-shadow: 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white, 0 0 10px white;
}

.sub-menu-035 .result__sub__menu__text {
  font-size: 100%;
  font-weight: bold;
  margin-bottom: 0;
}

.sub-menu-036 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-036__text {
  font-size: 100%;
  font-weight: bold;
  line-height: 150%;
  padding: 0 3% 3%;
}

.sub-menu-036__calendar {
  background-color: #f8f4ed;
  position: relative;
  width: 95%;
  margin: 0 auto;
}

.sub-menu-036__calendar__title {
  width: 80%;
  margin: 0 auto;
}

.sub-menu-036__calendar__title p {
  font-size: 87%;
  text-align: center;
  color: #b71111;
  margin: 0 0 4%;
}

.sub-menu-036__calendar__day-of-the-week {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.sub-menu-036__calendar__day-of-the-week div {
  margin: 2% 0;
  background-color: white;
  text-align: center;
  width: 13.2857142857%;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.38);
}

.sub-menu-036__calendar__day-of-the-week div p {
  font-size: 85%;
  padding: 6% 0;
}

.sub-menu-036__calendar__items__item {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.sub-menu-036__calendar__items__item__day {
  position: relative;
  width: 13.2857142857%;
  min-height: 4rem;
  background-color: white;
  margin-bottom: 1%;
  padding: 0 0 0.2rem 0;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.38);
}

.sub-menu-036__calendar__items__item__day__icon {
  position: absolute;
  opacity: 0;
  width: 20%;
  width: 70%;
  top: 11%;
  right: 15%;
  transition: all 1s;
}

.sub-menu-036__calendar__items__item__day__icon.show {
  opacity: 1;
}

.sub-menu-036__calendar__items__item__day__number {
  font-size: 89%;
  text-align: center;
  color: #000;
  margin: 77% 0% 0% 50%;
}

.sub-menu-036__calendar__flash {
  position: absolute;
  width: 60%;
  top: 25%;
  left: 20%;
  transition: all 1s;
}

.sub-menu-036__calendar__flash.move {
  transform: scale(2);
}

.sub-menu-036__calendar__flash.out {
  opacity: 0;
}

.sub-menu-036__guidance__title {
  margin: 3% 3% 0;
  padding: 3%;
  background-color: #01002a;
  color: #fff;
  text-align: center;
  font-weight: bold;
}

.sub-menu-036__guidance__text {
  text-align: left;
  font-size: 85%;
  line-height: 28px;
  margin: 2% 7% 0;
  padding-bottom: 5%;
}

.sub-menu-037 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-037__motif {
  opacity: 0;
  transition: all 1s;
  padding: 0 5%;
}

.sub-menu-037__motif.show {
  opacity: 1;
}

.sub-menu-038 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-038__motif {
  opacity: 0;
  transition: all 1s;
  padding: 0 5%;
}

.sub-menu-038__motif.show {
  opacity: 1;
}

.sub-menu-039 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-039__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-039__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-039__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-039__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-039__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-039__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-039__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-039;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-039__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-039__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-039;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-039__emperor-sign-new__container {
  position: absolute;
  overflow: hidden;
  z-index: 5;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.sub-menu-039__emperor-sign-new__container__name {
  position: absolute;
  font-weight: bold;
  opacity: 0;
  font-size: 110%;
  left: 15%;
  top: 5%;
  transition: all 1.5s;
  text-shadow: 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white;
}

.sub-menu-039__emperor-sign-new__container__name.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__target-name {
  position: absolute;
  font-weight: bold;
  opacity: 0;
  font-size: 110%;
  left: 60%;
  top: 5%;
  transition: all 1.5s;
  text-shadow: 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white, 0 0 3px white;
}

.sub-menu-039__emperor-sign-new__container__target-name.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__motif-left {
  z-index: 5;
  position: absolute;
  opacity: 0;
  width: 70%;
  top: 5%;
  left: -10%;
  transition: all 1.5s;
}

.sub-menu-039__emperor-sign-new__container__motif-left.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__motif-right {
  z-index: 5;
  position: absolute;
  opacity: 0;
  width: 70%;
  top: 5%;
  left: 40%;
  transition: all 1.5s;
}

.sub-menu-039__emperor-sign-new__container__motif-right.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__motif-text-left {
  position: absolute;
  opacity: 0;
  width: 80%;
  top: 83%;
  left: -15%;
  transition: all 1.5s;
}

.sub-menu-039__emperor-sign-new__container__motif-text-left.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__motif-text-right {
  position: absolute;
  opacity: 0;
  width: 80%;
  top: 83%;
  left: 35%;
  transition: all 1.5s;
}

.sub-menu-039__emperor-sign-new__container__motif-text-right.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__cross {
  display: block;
  position: absolute;
  opacity: 0;
  width: 20%;
  top: 50%;
  left: 40%;
  transition: all 1.5s;
}

.sub-menu-039__emperor-sign-new__container__cross.show {
  opacity: 1;
}

.sub-menu-039__emperor-sign-new__container__cross::before,
.sub-menu-039__emperor-sign-new__container__cross::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 7px;
  height: 30px;
  background: #333;
}

.sub-menu-039__emperor-sign-new__container__cross::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.sub-menu-039__emperor-sign-new__container__cross::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.sub-menu-039__motif-text {
  width: 85%;
  margin: 3% auto 2%;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-039__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-039__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-039__motif-text.show {
  opacity: 1;
}

.sub-menu-039__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-039__text.show {
  opacity: 1;
}

.sub-menu-039 .result__sub__menu__text {
  opacity: 0;
  transition: all 1s;
}

.sub-menu-039 .result__sub__menu__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-039 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-039 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub-menu-040 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-040__tarot {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 120vw;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(1) {
  position: absolute;
  width: 25%;
  top: 5%;
  left: 37%;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(2) {
  position: absolute;
  width: 25%;
  top: 53%;
  left: 64.5%;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(3) {
  position: absolute;
  width: 25%;
  top: 53%;
  left: 9.5%;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(4) {
  position: absolute;
  width: 25%;
  top: 66.5%;
  left: 37%;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(5) {
  position: absolute;
  width: 25%;
  top: 19%;
  left: 9.5%;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(6) {
  position: absolute;
  width: 25%;
  top: 19%;
  left: 64.5%;
}

.sub-menu-040__tarot .sub-menu-040__tarot__card:nth-child(7) {
  position: absolute;
  width: 25%;
  top: 36%;
  left: 37%;
}

.sub-menu-040__tarot__cards {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.sub-menu-040__tarot__cards div {
  width: 100%;
  height: 100%;
  position: relative;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(1) {
  position: absolute;
  width: 29%;
  top: 3.5%;
  left: 35%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(1).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(8) {
  position: absolute;
  width: 29%;
  top: 2.5%;
  left: 35%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(8).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(15) {
  position: absolute;
  width: 29%;
  top: 2.5%;
  left: 35%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(15).show {
  opacity: 1;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(2) {
  position: absolute;
  width: 29%;
  top: 17.7%;
  left: 62.6%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(2).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(9) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 62.7%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(9).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(16) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 62.7%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(16).show {
  opacity: 1;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(3) {
  position: absolute;
  width: 29%;
  top: 51.5%;
  left: 62.6%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(3).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(10) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 62.7%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(10).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(17) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 62.7%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(17).show {
  opacity: 1;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(4) {
  position: absolute;
  width: 29%;
  top: 65%;
  left: 35%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(4).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(11) {
  position: absolute;
  width: 29%;
  top: 65.3%;
  left: 35%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(11).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(18) {
  position: absolute;
  width: 29%;
  top: 65.3%;
  left: 35%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(18).show {
  opacity: 1;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(5) {
  position: absolute;
  width: 29%;
  top: 51.5%;
  left: 7.5%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(5).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(12) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 7.6%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(12).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(19) {
  position: absolute;
  width: 29%;
  top: 51.8%;
  left: 7.6%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(19).show {
  opacity: 1;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(6) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 7.5%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(6).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(13) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 7.6%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(13).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(20) {
  position: absolute;
  width: 29%;
  top: 17.5%;
  left: 7.6%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(20).show {
  opacity: 1;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(7) {
  position: absolute;
  width: 29%;
  top: 34.5%;
  left: 35%;
  opacity: 1;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__back:nth-child(7).hide {
  opacity: 0;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(14) {
  position: absolute;
  width: 29%;
  top: 34.3%;
  left: 35%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light__effect:nth-child(14).show {
  animation-name: scale-up-with-fadeout;
  animation-duration: 2s;
  animation-iteration-count: inherit;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(21) {
  position: absolute;
  width: 29%;
  top: 34.3%;
  left: 35%;
  opacity: 0;
  transition: all 2000ms;
}

.sub-menu-040__tarot__cards div .sub-menu-040__tarot__cards__light:nth-child(21).show {
  opacity: 1;
}

.sub-menu-040__sub-menu-title {
  opacity: 1;
  overflow: hidden;
  transition: all 1000ms;
  border: none;
}

.sub-menu-040__sub-menu-title.show {
  opacity: 1;
}

.sub-menu-040__sub-menu-title.hide {
  margin: 0 auto;
  padding: 0;
}

.sub-menu-040__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-040__text.show {
  opacity: 1;
}

.sub-menu-040__text.hide {
  margin: 0 auto;
}

.sub-menu-040 .result__sub__menu__center {
  background-color: rgba(249, 244, 237, 0.5411764706);
  transition: all 1s;
  margin: 0 5% 5%;
  opacity: 0;
}

@keyframes scale-up-with-fadeout {
  0% {
    opacity: 0;
    transform: scale(0);
  }

  20% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(3);
  }
}

.sub-menu-041 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-041__container {
  width: 100%;
  margin: 5% auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sub-menu-041__container__motif-card {
  opacity: 0;
  transition: all 1s;
  width: 50%;
  top: 10%;
  left: 25%;
}

.sub-menu-041__container__motif-card.show {
  opacity: 1;
}

.sub-menu-041 .result__sub__menu__text {
  opacity: 0;
  transition: all 1s;
}

.sub-menu-041 .result__sub__menu__text.show {
  opacity: 1;
}

.sub-menu-042 {
  width: 100%;
  overflow: hidden;
}

.sub-menu-042__container {
  position: relative;
  width: 100%;
  height: 63vw;
}

.sub-menu-042__container__motif-card {
  position: absolute;
  transition: all 1.5s;
  width: 50%;
  top: 0;
  left: 25%;
  transform: rotateY(-180deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.sub-menu-042__container__motif-card.show {
  transform: rotateY(0deg);
}

.sub-menu-042__container__back-card {
  position: absolute;
  transition: all 1.5s;
  width: 58%;
  top: -11px;
  left: 21%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.sub-menu-042__container__back-card.show {
  transform: rotateY(180deg);
}

.sub-menu-042 .result__sub__menu__text {
  opacity: 0;
  transition: all 1s;
}

.sub-menu-042 .result__sub__menu__text.show {
  opacity: 1;
}

.sub-menu-044 {
  width: 100%;
}

.sub-menu-044 .result__sub__menu__text-balloon {
  display: flex;
}

.sub-menu-044 .result__sub__menu__text-balloon > div {
  background: #5c5a58;
  border-radius: 1rem;
  color: #fff36c;
  padding: 1.5rem 0.5rem;
  margin: 0 auto;
}

.sub-menu-044 .result__sub__menu__text-balloon > div span {
  font-size: 1.6rem;
}

.sub-menu-045 {
  width: 100%;
}

.sub-menu-045__answer-message {
  position: relative;
  margin-block: -6%;
  background-color: #f9f4ed;
}

.sub-menu-045__answer-message__person {
  width: 50%;
  display: block;
  margin-left: 50%;
}

.sub-menu-045__answer-message__person img {
  width: 100%;
}

.sub-menu-045__answer-message__absolute-parent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.sub-menu-045__answer-message__absolute-parent__relative-parent {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-045__answer-message__absolute-parent__relative-parent div.window {
  position: absolute;
  width: 60%;
  top: 20%;
  left: 0%;
}

.sub-menu-045__answer-message__absolute-parent__relative-parent div.window .text {
  display: flex;
  align-items: center;
  text-align: left;
  padding: 2%;
  margin: 0% 0% 0% 5%;
  min-height: 7rem;
  border: 1px solid black;
  border-radius: 14px;
  font-size: 100%;
  line-height: 150%;
  color: white;
  background-color: rgba(0, 0, 0, 0.6392156863);
  box-shadow: 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff, 0px 0px 20px #fff;
  font-family: "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-045__answer-message__absolute-parent__relative-parent div.window .text span {
  font-size: 115%;
  font-weight: bold;
  word-break: break-all;
}

.sub-menu-046 {
  width: 100%;
  margin-bottom: 0%;
}

.sub-menu-046__container {
  position: relative;
  width: 96%;
  margin: 0 auto;
}

.sub-menu-046__container__background {
  width: 100%;
}

.sub-menu-046__container__flash {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 50%;
  top: 20%;
  left: 27%;
}

.sub-menu-046__container__flash.move {
  transform: scale(1.5);
  opacity: 1;
}

.sub-menu-046__container__flash.out {
  opacity: 0;
}

.sub-menu-046__container__age {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 16%;
  top: 15.5%;
  left: 14.5%;
}

.sub-menu-046__container__age.show {
  opacity: 1;
}

.sub-menu-046__container__season {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 12.3%;
  top: 14.9%;
  left: 30.5%;
}

.sub-menu-046__container__season.show {
  opacity: 1;
}

.sub-menu-046__container__guardian {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 53.5%;
  top: 14.5%;
  left: 44%;
}

.sub-menu-046__container__guardian.show {
  opacity: 1;
}

.sub-menu-046__container__frame {
  position: absolute;
  transition: all 1s;
  height: 100%;
  width: 100%;
  top: 0%;
  left: 0%;
}

.sub-menu-046__container__frame__row1 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 15%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row2 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 22%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row3 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 29%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row4 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 36.5%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row5 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 43.5%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row6 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 50.5%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row7 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 57.8%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row8 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 64.8%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row9 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 71.8%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row10 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 79.2%;
  left: 3.2%;
}

.sub-menu-046__container__frame__row11 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 86.2%;
  left: 3.2%;
}

.sub-menu-046__title {
  position: relative;
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 95%;
  font-weight: bold;
  text-align: left;
  opacity: 1;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33\FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671DPro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-046__title span {
  line-height: 1.1;
}

.sub-menu-046__title.hide {
  margin: 0 auto;
  padding: 0;
}

.sub-menu-046__text {
  opacity: 0;
  transition: opacity 1000ms ease;
  font-size: 85%;
  width: 88%;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-046__text.show {
  opacity: 1;
}

.sub-menu-046.hide {
  margin: 0 auto;
  padding: 0;
}

.frame-yellow {
  opacity: 0;
  box-shadow: 0 0 10px #f9ff54 inset, 1px -1px 10px #f9ff54, -1px 1px 10px #f9ff54, -1px 1px 10px #f9ff54, 1px -1px 10px #f9ff54;
  outline: solid 1px #f9ff54;
  transform: scale(1.5);
  transition: all 600ms;
}

.frame-yellow.show {
  opacity: 1;
  transform: scale(1);
}

.sub-menu-047 {
  width: 100%;
  margin-bottom: 0%;
}

.sub-menu-047__container {
  position: relative;
  width: 96%;
  margin: 0 auto;
}

.sub-menu-047__container__background {
  width: 100%;
}

.sub-menu-047__container__flash {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 50%;
  top: 20%;
  left: 27%;
}

.sub-menu-047__container__flash.move {
  transform: scale(1.5);
  opacity: 1;
}

.sub-menu-047__container__flash.out {
  opacity: 0;
}

.sub-menu-047__container__age {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 16%;
  top: 15.5%;
  left: 14.5%;
}

.sub-menu-047__container__age.show {
  opacity: 1;
}

.sub-menu-047__container__season {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 12.3%;
  top: 14.9%;
  left: 30.5%;
}

.sub-menu-047__container__season.show {
  opacity: 1;
}

.sub-menu-047__container__guardian {
  position: absolute;
  transition: all 1s;
  opacity: 0;
  width: 53.5%;
  top: 14.5%;
  left: 44%;
}

.sub-menu-047__container__guardian.show {
  opacity: 1;
}

.sub-menu-047__container__frame {
  position: absolute;
  transition: all 1s;
  height: 100%;
  width: 100%;
  top: 0%;
  left: 0%;
}

.sub-menu-047__container__frame__row1 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 15%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row2 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 22%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row3 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 29%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row4 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 36.5%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row5 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 43.5%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row6 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 50.5%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row7 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 57.8%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row8 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 64.8%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row9 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 71.8%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row10 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 79.2%;
  left: 3.2%;
}

.sub-menu-047__container__frame__row11 {
  position: absolute;
  width: 93.3%;
  height: 7%;
  top: 86.2%;
  left: 3.2%;
}

.sub-menu-047__title {
  position: relative;
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 95%;
  font-weight: bold;
  text-align: left;
  opacity: 1;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33\FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671DPro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-047__title span {
  line-height: 1.1;
}

.sub-menu-047__title.hide {
  margin: 0 auto;
  padding: 0;
}

.sub-menu-047__text {
  opacity: 0;
  transition: opacity 1000ms ease;
  font-size: 85%;
  width: 88%;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.sub-menu-047__text.show {
  opacity: 1;
}

.sub-menu-047.hide {
  margin: 0 auto;
  padding: 0;
}

.frame-yellow {
  opacity: 0;
  box-shadow: 0 0 10px #f9ff54 inset, 1px -1px 10px #f9ff54, -1px 1px 10px #f9ff54, -1px 1px 10px #f9ff54, 1px -1px 10px #f9ff54;
  outline: solid 1px #f9ff54;
  transform: scale(1.5);
  transition: all 600ms;
}

.frame-yellow.show {
  opacity: 1;
  transform: scale(1);
}

.sub-menu-048 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.sub-menu-048__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.sub-menu-048__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.sub-menu-048__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.sub-menu-048__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.sub-menu-048__emperor-sign-new__images__outline img {
  position: absolute;
}

.sub-menu-048__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.sub-menu-048__emperor-sign-new__images__outline__left.slide {
  animation-name: slide-left-048;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-048__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.sub-menu-048__emperor-sign-new__images__outline__right.slide {
  animation-name: slide-right-048;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.sub-menu-048__emperor-sign-new__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
  scale: 0.8;
}

.sub-menu-048__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-048__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.sub-menu-048__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.sub-menu-048__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.sub-menu-048__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.sub-menu-048__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.sub-menu-048__motif-text.show {
  opacity: 1;
  line-height: 1.2rem;
}

.sub-menu-048__text {
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  text-align: center;
  font-size: 100%;
  opacity: 0;
  overflow: hidden;
  transition: all 1000ms;
}

.sub-menu-048__text.show {
  opacity: 1;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left-048 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right-048 {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.sub_menu_100__date {
  font-size: 230%;
  color: #bb5050;
}

.sub_menu_100__date.sub_menu_100__blink {
  animation: blink 1.5s ease-in-out infinite alternate;
}

.sub_menu_100__date.first_marriage {
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
  color: #ffdc81;
}

.pattern1-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: white;
  padding: 2% 3%;
  margin: 4%;
  border-radius: 7px;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
}

.pattern1-benefits__banner img {
  width: 100%;
}

.pattern1-benefits__item {
  background-color: #fffec6;
  margin-top: 5%;
  padding-bottom: 3%;
}

.pattern1-benefits__item__description {
  color: black;
  font-size: 85%;
  text-align: center;
  line-height: 140%;
  padding: 2% 0 0 0;
  margin: 3% 3% 5% 5%;
}

.pattern1-benefits__item__description.acquired {
  background-color: #fb8888;
  color: white;
}

.pattern1-benefits .menu-block {
  display: flex;
  align-items: center;
}

.pattern1-benefits .menu-block.none {
  pointer-events: none;
  margin-top: 4%;
  font-weight: bold;
}

.pattern1-benefits .menu-block__icon {
  width: 20%;
  margin-right: 5%;
}

.pattern1-benefits .menu-block__icon.none {
  filter: brightness(0.5);
}

.pattern1-benefits .menu-block__name {
  width: 80%;
  color: black;
  font-size: 100%;
  line-height: 1.3rem;
}

.pattern1-benefits .menu-block__name.none {
  text-decoration: none;
  color: #6f6f6f;
}

.pattern1-benefits .free-menu-wrapper {
  position: relative;
  width: 100%;
  font-size: 90%;
  margin-top: 5%;
}

.pattern1-benefits .free-menu-wrapper::before {
  content: "\25BC\3053\3061\3089\306E\9650\5B9A\9451\5B9A\3092\30D7\30EC\30BC\30F3\30C8\25BC";
  background-color: #fb8888;
  padding: 1% 0;
  position: absolute;
  text-align: center;
  transform: translate(-50%, -50%);
  top: -35%;
  left: 50%;
  width: 85%;
  font-size: 85%;
  color: white;
}

.pattern1-benefits__btn img {
  width: 80%;
}

.pattern2-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: white;
  padding: 2% 3%;
  margin: 4%;
  border-radius: 7px;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
}

.pattern2-benefits__banner img {
  width: 100%;
}

.pattern2-benefits__item {
  background-color: white;
  margin: 5%;
  padding: 3%;
  font-weight: bold;
  border: 1px solid #010029;
}

.pattern2-benefits__item__text {
  padding: 4% 0%;
  text-align: center;
  font-size: 91%;
  font-weight: 100;
}

.pattern2-benefits__item__text__purchase {
  padding: 5% 2% 2%;
  text-align: center;
  font-weight: 100;
}

.pattern2-benefits__item__image {
  width: 42%;
  margin: 5% 29%;
}

.pattern2-benefits__item > p {
  color: black;
}

.pattern2-benefits__item__text-bottom {
  margin: auto 3%;
}

.pattern2-benefits__item > button {
  display: block;
  text-align: center;
  width: 100%;
}

.pattern2-benefits__item > button > img {
  width: 35%;
  margin: 5% 0;
}

.pattern2__text {
  display: flex;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: 1% 6%;
  font-weight: 100;
  line-height: 145%;
  background-color: #f9f4ed;
  text-align: left;
}

.pattern3-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: transparent;
  margin: 1% 3% 5% 3%;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
}

.pattern3-benefits__banner {
  width: 92%;
  margin: 0 auto 5%;
}

.pattern3-benefits__banner img {
  width: 100%;
}

.pattern3-benefits__explanation {
  margin: 5%;
  text-align: left;
}

.pattern3-benefits__contents {
  display: flex;
}

.pattern3-benefits__contents img {
  width: 42%;
  margin: 3%;
}

.pattern3-benefits__contents__text {
  display: block;
  padding: 2%;
  margin-right: 2%;
}

.pattern3-benefits__contents p {
  text-align: left;
  font-weight: 100;
}

.pattern3-benefits__description-top {
  width: 75%;
  margin: 0 auto;
  text-align: left;
  color: #000000;
  font-size: 110%;
  line-height: 170%;
}

.pattern3-benefits__purchased-banner {
  margin-bottom: 5%;
}

.pattern3-benefits__purchased-banner img {
  width: 100%;
}

.pattern3-benefits__description {
  color: #000000;
  text-align: center;
  padding: 3% 0% 5% 0%;
  margin: 2% 2% 2% 2%;
  background-color: #fff;
}

.pattern3-benefits__description__present__head {
  width: 80%;
  margin: 8% auto 2%;
  margin: 3% auto 5%;
}

.pattern3-benefits__description__purchased {
  width: 95%;
  margin: 0 auto;
  background-color: #fff;
}

.pattern3-benefits__description__purchased__title {
  display: flex;
  flex-direction: column;
  width: 92%;
  text-align: center;
  background-color: #EFD26A;
  margin: 4%;
  font-size: 105%;
  font-weight: bold;
  padding: 3%;
}

.pattern3-benefits__description__purchased__explanation {
  margin: 5%;
  text-align: left;
}

.pattern3-benefits__description__purchased__contents {
  display: flex;
}

.pattern3-benefits__description__purchased__contents img {
  width: 40%;
  margin: 3% 1%;
}

.pattern3-benefits__description__purchased__contents__text {
  display: block;
  padding: 2%;
  margin-right: 2%;
}

.pattern3-benefits__description__purchased__contents p {
  text-align: left;
  font-weight: 100;
}

.pattern3-benefits__description__purchased__present-details {
  background-color: #fbf3d3;
  margin: 5% 0.5%;
  padding: 2%;
  border: 1px solid rgba(0, 0, 0, 0.4705882353);
  text-align: left;
}

.pattern3-benefits__description__purchased__present-details__border {
  border: 1px dashed #000;
}

.pattern3-benefits__description__purchased__present-details p {
  margin: 4%;
}

.pattern3-benefits__description__purchased__present-details p span {
  color: #f76464;
}

.pattern3-benefits__description__purchased__purchased-banner {
  width: 93%;
  margin: 2% auto 8%;
}

.pattern3-benefits__description__purchased__purchased-description {
  font-size: 130%;
  color: #002060;
}

.pattern3-benefits__description__purchased__purchased-description-bottom {
  width: 70%;
  margin: 4% auto;
  padding: 4% 0;
  text-align: left;
  font-size: 100%;
  color: #000000;
  border-top: 1px solid #3b3838;
}

.pattern3-benefits__description__purchased__apply-btn {
  width: 60%;
  margin: 5% auto;
  padding: 3% 0;
  border-radius: 5px;
  background-color: #43215d;
  text-align: center;
  color: #fff;
  font-size: 110%;
}

.pattern3-benefits__description__purchased__apply-btn:hover {
  width: 60%;
  margin: 5% auto;
  padding: 3% 0;
  border-radius: 5px;
  background-color: #7030a0;
  text-align: center;
  color: #fff;
  font-size: 110%;
  opacity: 0.8;
}

.pattern4-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2% 3%;
  margin: 4% 2%;
  border-radius: 7px;
}

.pattern4-benefits .pattern4-benefits-container {
  background-color: #fff;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
  padding: 3% 3% 5% 3%;
}

.pattern4-benefits__banner img {
  width: 100%;
  margin: 5%;
}

.pattern4-benefits__item {
  background-color: white;
  margin: 5%;
  padding: 3%;
  font-weight: bold;
  border: 1px solid #010029;
}

.pattern4-benefits__item__text {
  padding: 4% 2%;
  text-align: left;
  font-size: 95%;
}

.pattern4-benefits__item__text__purchase {
  padding: 5% 2% 2%;
  text-align: center;
}

.pattern4-benefits__item__image {
  width: 50%;
  margin: 5% 25%;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
}

.pattern4-benefits__item > p {
  color: black;
}

.pattern4-benefits__item__text-bottom {
  margin: auto 3%;
}

.pattern4-benefits__item > a {
  display: block;
  text-align: center;
}

.pattern4-benefits__item > a > img {
  width: 40%;
  margin: 5% 0;
}

.pattern4-benefits__present {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 5% 0 0 0%;
}

.pattern4-benefits__present__img {
  width: 20%;
  transform: rotate(-15deg);
  margin-right: 2%;
}

.pattern4-benefits__present__text {
  width: 90%;
  text-align: center;
  font-size: 90%;
  font-weight: bold;
}

.pattern4-benefits__present__text span {
  color: #c00000;
}

.pattern4-benefits__present__ticket {
  display: flex;
  align-items: center;
  padding: 5% 4%;
}

.pattern4-benefits__present__ticket__img {
  width: 25%;
  margin-left: 9%;
}

.pattern4-benefits__present__ticket__text {
  width: 48%;
  text-align: center;
  font-size: 100%;
  font-weight: bold;
}

.pattern4-benefits__present__ticket__text span {
  color: #c00000;
}

.pattern4-benefits__present__ticket__text span .number-of-sheets {
  font-size: 30%;
}

.pattern4__text {
  display: flex;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: 3% 5%;
  font-weight: bold;
  line-height: 155%;
  background-color: #f9f4ed;
}

.pattern5-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: white;
  padding: 2% 3%;
  margin: 4%;
  border-radius: 7px;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
}

.pattern5-benefits__banner img {
  width: 100%;
}

.pattern5-benefits__item {
  position: relative;
  padding: 1rem 0rem 1rem;
  width: 95%;
  margin: 2rem auto 4rem;
  border-radius: 10px;
  background-color: #f9f9f9;
}

.pattern5-benefits__item__recommend {
  font-size: 110%;
  font-weight: bold;
  text-align: center;
  margin: 2%;
}

.pattern5-benefits__item__text {
  width: 90%;
  margin: 3% auto;
  font-size: 105%;
  line-height: 1.5;
}

.pattern5-benefits__item__text-container {
  width: 95%;
  margin: 5% auto;
}

.pattern5-benefits__item__text-container .prize_flex p {
  font-size: 1.2rem;
  color: #c00000;
  margin: 0 5%;
  border-left: 15px solid #c00000;
}

.pattern5-benefits__item__text-container .prize_text {
  margin-left: 5%;
}

.pattern5-benefits__item__text-container .prize_box {
  margin-bottom: 6%;
}

.pattern5-benefits__item__text-container .prize_box:last-child {
  margin-bottom: 0;
}

.pattern5-benefits__item__text-area {
  text-align: center;
  padding: 3% 5% 5%;
  margin: 1%;
  font-weight: bold;
  z-index: 1;
  position: relative;
  background-color: #f9f9f9;
  border: 1px solid #1d2946;
}

.pattern5-benefits__item__text-area__title {
  color: #002060;
  font-size: 1.4rem;
  line-height: 2rem;
  border-bottom: 2px solid black;
  margin-bottom: 1rem;
  padding-bottom: 1%;
}

.pattern5-benefits__item__text-area .prize_flex {
  margin-top: 5%;
  display: flex;
  justify-content: center;
}

.pattern5-benefits__item__text-area .prize_flex p {
  font-size: 1.4rem;
  text-align: center;
  color: #002060;
  margin: 0 5%;
}

.pattern5-benefits__item__text-area .prize_flex__img {
  width: 10%;
}

.pattern5-benefits__item__text-area .prize_text {
  display: flex;
  text-align: left;
  margin-top: 5%;
}

.pattern5-benefits__item__text-area .prize_text__img {
  width: 38%;
}

.pattern5-benefits__item__text-area .prize_text__items {
  text-align: center;
  line-height: 1.7;
  width: 62%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.pattern5-benefits__item__text-area .prize_text__items__item {
  font-size: 110%;
}

.pattern5-benefits__item__text-area .prize_text__items__winner-num {
  color: #c00000;
  font-size: 180%;
}

.pattern5-benefits__item__prize {
  border: 2px solid #c00000;
  border-radius: 25px;
  margin-bottom: 5%;
}

.pattern5-benefits__item__prize .prize_text__items__title {
  color: #c00000;
  font-size: 150%;
  margin: -5% auto 0;
  background-color: #f9f9f9;
  width: 35%;
}

.pattern5-benefits__item__prize .prize_text__items__item {
  font-size: 130%;
}

.pattern5-benefits__item__prize .prize_text__items__winner-num {
  color: #c00000;
  font-size: 120%;
  margin: 5% 0;
}

.pattern5-benefits__btn {
  background-color: #002060;
  border-radius: 5px;
  color: #fff;
  width: 70%;
  margin: 7% auto 3%;
}

.pattern5-benefits__btn button {
  width: 100%;
}

.pattern5-benefits__btn button p {
  padding: 5% 0;
  font-size: 110%;
  text-align: center;
}

.pattern6-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: white;
  padding: 2% 3%;
  margin: 4%;
  border-radius: 7px;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
}

.pattern6-benefits__banner img {
  width: 100%;
}

.pattern6-benefits__item {
  background-color: white;
  margin: 5%;
  padding: 3%;
  font-weight: bold;
  border: 1px solid #010029;
}

.pattern6-benefits__item__text {
  padding: 4% 2%;
  text-align: center;
  font-size: 95%;
  font-weight: 100;
}

.pattern6-benefits__item__text__purchase {
  padding: 5% 2% 2%;
  text-align: center;
  font-weight: 100;
}

.pattern6-benefits__item__image {
  width: 42%;
  margin: 5% 29%;
}

.pattern6-benefits__item > p {
  color: black;
}

.pattern6-benefits__item__text-bottom {
  margin: auto 3%;
}

.pattern6-benefits__item > button {
  display: block;
  text-align: center;
  width: 100%;
}

.pattern6-benefits__item > button > img {
  width: 35%;
  margin: 5% 0;
}

.pattern6__text {
  display: flex;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: 1% 6%;
  font-weight: 100;
  line-height: 145%;
  background-color: #f9f4ed;
  text-align: left;
}

.pattern7-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: white;
  padding: 2% 3%;
  margin: 4%;
  border-radius: 7px;
  filter: drop-shadow(4px 4px 6px rgb(90, 90, 90));
}

.pattern7-benefits__banner img {
  width: 100%;
}

.pattern7-benefits__item {
  background-color: white;
  margin: 5%;
  padding: 3%;
  font-weight: bold;
  border: 1px solid #010029;
}

.pattern7-benefits__item__text {
  padding: 4% 2%;
  text-align: center;
  font-size: 95%;
  font-weight: 100;
}

.pattern7-benefits__item__text__purchase {
  padding: 5% 2% 2%;
  text-align: center;
  font-weight: 100;
}

.pattern7-benefits__item__image {
  width: 100%;
  margin: 5% 0%;
  display: flex;
  justify-content: center;
}

.pattern7-benefits__item__image__present {
  width: 100%;
  margin: 5% 0%;
  display: flex;
  justify-content: center;
}

.pattern7-benefits__item > p {
  color: black;
}

.pattern7-benefits__item__text-bottom {
  margin: auto 3%;
}

.pattern7-benefits__item > button {
  display: block;
  text-align: center;
  width: 100%;
}

.pattern7-benefits__item > button > img {
  width: 35%;
  margin: 5% 0;
}

.pattern7__text {
  display: flex;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: 1% 6%;
  font-weight: 100;
  line-height: 145%;
  background-color: #f9f4ed;
  text-align: left;
}

.pattern7-download-btn {
  padding: 12px 16px;
  margin-top: 16px;
  background: #01002A;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.05s ease;
}

.pattern7-download-btn:active {
  background: gray;
}

.pattern7-benefits__present__img {
  border-radius: 3px;
  text-align: center;
  background-color: white;
}

.pattern7-benefits__present__img__menu {
  display: flex;
  justify-content: center;
  margin: 5% 2%;
}

.pattern7-benefits__present__img__sample {
  width: 60%;
}

.pattern7-benefits__present__img__text {
  display: flex;
  text-align: left;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: 1% 6%;
  font-weight: 100;
  line-height: 145%;
  background-color: #f9f4ed;
}

.new-menu__center {
  width: 80%;
  margin: 0 auto;
  display: block;
}

.new-menu__center_description {
  width: 85%;
  margin: 1rem auto;
  line-height: 140%;
  font-weight: bold;
}

.new-menu__center_gradation {
  height: 2rem;
  background: linear-gradient(180deg, rgba(226, 210, 163, 0), #f9f4ed);
}

.new-menu__center_gradation_bottom {
  height: 5rem;
  background: linear-gradient(180deg, rgba(226, 210, 163, 0), #f9f4ed);
  transform: scale(1, -1);
}

.power_spot_desplay {
  background-color: #f9f4e9;
  padding-bottom: 10%;
}

.power_spot_desplay_image {
  width: 90%;
}

.power_spot_desplay_sub_text {
  font-size: smaller;
  width: 80%;
  margin: 0 auto;
  margin-bottom: 10%;
  line-height: 140%;
  font-weight: bold;
}

.power_spot_desplay_spot_name {
  font-size: x-large;
  font-weight: bold;
  text-align: center;
}

.power_spot_desplay_desc {
  width: 80%;
  margin: 0 auto;
  margin-top: 5%;
  border: 1px solid #333333;
  padding: 5%;
  background: white;
  line-height: 140%;
}

.power_spot_desplay_houi {
  font-size: x-large;
  text-align: center;
  padding-top: 7%;
  padding-bottom: 7%;
}

.power_spot_no_desplay {
  background-color: #f9f4e9;
  padding: 10%;
  text-align: center;
}

.power_spot_no_desplay_title {
  line-height: 30px;
}

.power_spot_no_desplay_link {
  margin: 0 auto;
  display: block;
  margin-top: 5%;
}

.power_spot_no_desplay_link img {
  width: 50%;
  display: block;
  margin: 0 auto;
}

.power_spot_no_desplay_houi {
  font-size: x-large;
  text-align: center;
  padding-top: 7%;
  padding-bottom: 7%;
}

.month_power_stamp_book {
  position: relative;
}

.month_power_stamp_book_title {
  text-align: center;
  font-size: large;
  line-height: 140%;
  font-weight: bold;
}

.month_power_stamp_book_stamp {
  margin: 0 auto;
  display: block;
  width: 100%;
}

.month_power_stamp_book_stamp img {
  width: 70%;
  display: block;
  margin-left: 25%;
}

.month_power_stamp_book_stamp_image {
  opacity: 0;
  margin: 0 auto;
  position: absolute;
  top: 0%;
  left: -35%;
  right: 0;
  width: 50%;
  transform: rotate(-15deg);
}

.month_power_stamp_book_stamp_image img {
  width: 50%;
  display: block;
  margin: 0 auto;
}

.month_power_stamp_book_btn {
  margin: 0 auto;
  display: block;
  margin-top: 5%;
  margin-bottom: 25%;
}

.month_power_stamp_book_btn img {
  width: 60%;
  display: block;
  margin: 0 auto;
}

.note-component {
  width: 100%;
}

.power-spots-list {
  position: fixed;
  overflow-y: auto;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 94%;
  top: 7%;
  left: 0;
  z-index: 1000;
}

.power-spots-list__menu {
  background-image: url(https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/month_power_spot/book_vertical.png);
  background-size: 104%;
}

.power-spots-list__menu__content__text_prefecture {
  width: 60%;
  margin: 0 auto;
  font-size: x-large;
  font-weight: bold;
}

.power-spots-list_image {
  width: 90%;
  margin-left: 6%;
}

.power-spots-list_body {
  width: 80%;
  margin: 0 auto;
  margin-top: 5%;
  border: 1px solid #333333;
  padding: 5%;
  margin-left: 14%;
}

.power-spots-list_bottom {
  z-index: 10;
  width: 100%;
}

.power-spots-list_top {
  width: 100%;
  position: absolute;
}

.power-spots-list_vertical {
  position: absolute;
  top: 1.5%;
  width: 10%;
  left: 0;
  height: 96%;
}

@keyframes stamp_in_stamp {
  0% {
    height: 0%;
    transform: scale(5) rotate(-1400deg);
    opacity: 0;
  }

  100% {
    height: 25%;
    opacity: 1;
  }
}

.stamp_get {
  opacity: 1;
  animation-delay: 1s;
  animation: stamp_in_stamp 1.5s ease-in-out;
}

.first-result {
  text-align: center;
}

.first-result__introduction {
  padding: 2rem 0.5rem 1rem 0.5rem;
  text-align: center;
  font-size: 108%;
  font-weight: bold;
  line-height: 130%;
}

.first-result__introduction__bg-img-parent {
  position: relative;
}

.first-result__introduction__bg-img-parent img {
  width: 100%;
}

.first-result__introduction__bg-img-parent img.teller-position-right {
  width: 70%;
  display: block;
  margin: 0 0 0 auto;
}

.first-result__introduction__bg-img-parent div {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.first-result__introduction__bg-img-parent div div {
  position: absolute;
}

.first-result__introduction__bg-img-parent div div.mosaic-face-img-parent {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.first-result__introduction__bg-img-parent div div.mosaic-face-img-parent img {
  width: 59%;
}

.first-result__introduction__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(1) {
  position: absolute;
  top: 20%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__introduction__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(2) {
  position: absolute;
  top: 40%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__introduction__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(3) {
  position: absolute;
  top: 60%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__introduction__bg-img-parent div p.days-text {
  font-size: 230%;
  color: #bb5050;
}

.first-result__introduction__bg-img-parent div p.text-on-ring-image {
  font-size: 230%;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
  color: #ffdc81;
}

.first-result__introduction__bg-img-parent div p.compatibility-text {
  font-size: 355%;
  color: #bb5050;
}

.first-result__introduction__bg-img-parent div p.marriage-days-text {
  font-size: 230%;
  color: #bb5050;
}

.first-result__introduction__bg-img-parent div p.teller-message-box {
  width: 63%;
}

.first-result__introduction__bg-img-parent div.teller-message-box-parent {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-weight: bold;
}

.first-result__introduction__bg-img-parent div.teller-message-box-parent p {
  width: 61%;
  max-height: 100%;
  padding: 0.5rem;
  background-color: rgba(255, 255, 255, 0.5490196078);
}

.first-result__introduction__clear-bg {
  width: 100%;
  padding-top: 1rem;
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/guest/result/introduction_clear_bg.png");
  background-repeat: repeat-y;
}

.first-result__recommend {
  width: 90%;
  margin: 0 auto;
  margin-top: 0.4rem;
  text-align: left;
  border: 1px solid #1d2946;
  background-color: #f9f9f9;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
}

.first-result__recommend__title {
  width: 100%;
  margin: 0.5rem 4%;
  display: flex;
  align-items: center;
}

.first-result__recommend__title img {
  width: 3.5rem;
  height: 3.5rem;
}

.first-result__recommend__title p {
  width: calc(100% - 7rem);
  margin: 0rem 1rem;
  color: black;
  font-size: 90%;
  font-weight: bold;
  line-height: 1.5rem;
  text-decoration: underline;
}

.first-result__foot-section {
  padding: 2rem 0.5rem 1rem;
  font-size: 108%;
  font-weight: bold;
  line-height: 130%;
}

.first-result__foot-section__bg-img-parent {
  position: relative;
}

.first-result__foot-section__bg-img-parent img {
  width: 100%;
}

.first-result__foot-section__bg-img-parent img.teller-position-right {
  width: 70%;
  display: block;
  margin: 0 0 0 auto;
}

.first-result__foot-section__bg-img-parent div {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.first-result__foot-section__bg-img-parent div div {
  position: absolute;
}

.first-result__foot-section__bg-img-parent div div.mosaic-face-img-parent {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.first-result__foot-section__bg-img-parent div div.mosaic-face-img-parent img {
  width: 59%;
}

.first-result__foot-section__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(1) {
  position: absolute;
  top: 20%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__foot-section__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(2) {
  position: absolute;
  top: 40%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__foot-section__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(3) {
  position: absolute;
  top: 60%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__foot-section__bg-img-parent div p.days-text {
  font-size: 230%;
  color: #bb5050;
}

.first-result__foot-section__bg-img-parent div p.text-on-ring-image {
  font-size: 230%;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
  color: #ffdc81;
}

.first-result__foot-section__bg-img-parent div p.compatibility-text {
  font-size: 355%;
  color: #bb5050;
}

.first-result__foot-section__bg-img-parent div p.marriage-days-text {
  font-size: 230%;
  color: #bb5050;
}

.first-result__foot-section__bg-img-parent div p.teller-message-box {
  width: 63%;
}

.first-result__foot-section__bg-img-parent div.teller-message-box-parent {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-weight: bold;
}

.first-result__foot-section__bg-img-parent div.teller-message-box-parent p {
  width: 61%;
  max-height: 100%;
  padding: 0.5rem;
  background-color: rgba(255, 255, 255, 0.5490196078);
}

.first-result__foot-section__clear-bg {
  width: 100%;
  padding-top: 1rem;
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/guest/result/introduction_clear_bg.png");
  background-repeat: repeat-y;
}

.first-result__recommend {
  width: 90%;
  margin: 0 auto;
  margin-top: 0.4rem;
  text-align: left;
  border: 1px solid #1d2946;
  background-color: #f9f9f9;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
}

.first-result__recommend__title {
  width: 100%;
  margin: 0.5rem 4%;
  display: flex;
  align-items: center;
}

.first-result__recommend__title img {
  width: 3.5rem;
  height: 3.5rem;
}

.first-result__recommend__title p {
  width: calc(100% - 7rem);
  margin: 0rem 1rem;
  color: black;
  font-size: 90%;
  font-weight: bold;
  line-height: 1.5rem;
  text-decoration: underline;
}

.first-result__no_under_space {
  padding: 2rem 0.5rem 0;
  font-size: 108%;
  font-weight: bold;
  line-height: 130%;
}

.first-result__no_under_space__bg-img-parent {
  position: relative;
}

.first-result__no_under_space__bg-img-parent img {
  width: 100%;
}

.first-result__no_under_space__bg-img-parent img.teller-position-right {
  width: 70%;
  display: block;
  margin: 0 0 0 auto;
}

.first-result__no_under_space__bg-img-parent div {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

.first-result__no_under_space__bg-img-parent div div {
  position: absolute;
}

.first-result__no_under_space__bg-img-parent div div.mosaic-face-img-parent {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.first-result__no_under_space__bg-img-parent div div.mosaic-face-img-parent img {
  width: 59%;
}

.first-result__no_under_space__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(1) {
  position: absolute;
  top: 20%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__no_under_space__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(2) {
  position: absolute;
  top: 40%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__no_under_space__bg-img-parent div div.mosaic-face-img-parent p:nth-of-type(3) {
  position: absolute;
  top: 60%;
  left: 6%;
  transform: rotate(-10deg);
  color: white;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
}

.first-result__no_under_space__bg-img-parent div p.days-text {
  font-size: 230%;
  color: #bb5050;
}

.first-result__no_under_space__bg-img-parent div p.text-on-ring-image {
  font-size: 230%;
  text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black, 0 0 3px black;
  color: #ffdc81;
}

.first-result__no_under_space__bg-img-parent div p.compatibility-text {
  font-size: 355%;
  color: #bb5050;
}

.first-result__no_under_space__bg-img-parent div p.marriage-days-text {
  font-size: 230%;
  color: #bb5050;
}

.first-result__no_under_space__bg-img-parent div p.teller-message-box {
  width: 63%;
}

.first-result__no_under_space__bg-img-parent div.teller-message-box-parent {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-weight: bold;
}

.first-result__no_under_space__bg-img-parent div.teller-message-box-parent p {
  width: 61%;
  max-height: 100%;
  padding: 0.5rem;
  background-color: rgba(255, 255, 255, 0.5490196078);
}

.first-result__no_under_space__clear-bg {
  width: 100%;
  padding-top: 1rem;
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/guest/result/introduction_clear_bg.png");
  background-repeat: repeat-y;
}

.first-result__recommend {
  width: 90%;
  margin: 0 auto;
  margin-top: 0.4rem;
  text-align: left;
  border: 1px solid #1d2946;
  background-color: #f9f9f9;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
}

.first-result__recommend__title {
  width: 100%;
  margin: 0.5rem 4%;
  display: flex;
  align-items: center;
}

.first-result__recommend__title img {
  width: 3.5rem;
  height: 3.5rem;
}

.first-result__recommend__title p {
  width: calc(100% - 7rem);
  margin: 0rem 1rem;
  color: black;
  font-size: 90%;
  font-weight: bold;
  line-height: 1.5rem;
  text-decoration: underline;
}

.first-result__top__container {
  display: grid;
  place-items: center;
}

.first-result__top__img {
  grid-area: 1/1;
  width: 35%;
  margin-left: 60%;
}

.first-result__top__text {
  grid-area: 1/1;
  text-align: left;
  top: 8%;
  font-size: 95%;
  margin: 0% 30% 0% 2%;
  background-color: rgba(0, 0, 0, 0.6392156863);
  color: white;
  border-radius: 14px;
  padding: 5% 3% 5%;
  line-height: 1.4rem;
}

.first-result__show-next-btn {
  width: 100%;
  display: block;
  padding: 2rem 0;
}

.first-result__show-next-btn img {
  width: 50%;
}

.first-result__show-next-btn__under_space {
  width: 100%;
  display: block;
  padding: 2rem 0 3rem;
}

.first-result__show-next-btn__under_space img {
  width: 50%;
}

.font-color-dark-red {
  color: #b71111;
}

.blink {
  animation: blink 1.5s ease-in-out infinite alternate;
}

.recommend-title {
  color: white;
  font-size: 140%;
  padding: 3% 0;
  background-color: #01002a;
  text-align: center;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  margin: 7% 0;
}

.affinity {
  margin: 10%;
}

.affinity__motif {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 10% 0 5% 0;
  position: relative;
  align-items: center;
}

.affinity__motif__img {
  width: 40%;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
}

.affinity__motif__img__name {
  text-align: center;
  width: 100%;
  font-weight: 600;
}

.affinity__motif__img__name textarea {
  resize: none;
  word-wrap: break-word;
  word-break: break-all;
}

.affinity__motif__img img {
  z-index: 1;
  width: 120%;
  transition: all 1000ms;
}

.affinity__motif__img img.movex.left {
  transform: translateX(-28%);
}

.affinity__motif__img img.movex.right {
  transform: translateX(28%);
}

.affinity__motif__img img.movey {
  animation: affinity-img-animation 1.5s infinite;
}

.affinity__motif .me {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 19%;
}

.affinity__motif .target {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 83%;
}

.affinity__motif__heart {
  width: 50%;
  display: grid;
  align-items: center;
  position: relative;
}

.affinity__motif__heart img {
  width: 100%;
  transition: all 1000ms;
  opacity: 0;
  transform: scale(0);
}

.affinity__motif__heart img.fadein {
  opacity: 1;
  transform: scale(1);
}

.affinity__motif__heart img.anim {
  animation: affinity-heart-animation 1.5s infinite;
}

.affinity__motif__heart p {
  z-index: 3;
  text-align: center;
  position: absolute;
  padding: 2%;
  margin-left: 0.1rem;
  left: 50%;
  transform: translate(-50%, -50%) scale(1.7);
  font-weight: 600;
  border-radius: 50%;
  transition: all 1s;
}

.affinity__motif__heart p.fadeout {
  opacity: 0;
}

.affinity__motif__heart p.anim {
  transform: translate(-50%, -50%) scale(3);
}

@keyframes affinity-heart-animation {
  0% {
    transform: scale(1, 0.8);
  }

  20% {
    transform: scale(0.8, 1.1);
  }

  90% {
    transform: scale(1, 1);
  }

  100% {
    transform: scale(1, 0.8);
  }
}

@keyframes affinity-img-animation {
  0% {
    transform: translateY(0);
  }

  25% {
    transform: rotate(-20deg);
  }

  50% {
    transform: translateY(-20%);
  }

  75% {
    transform: rotate(20deg);
  }

  100% {
    transform: translateY(0);
  }
}

body {
  font-size: 200%;
}

.marokusatsu-result {
  width: 100%;
  margin: 0 auto;
}

.marokusatsu-result__top-text {
  text-align: left;
  font-size: 110%;
  font-weight: bold;
  line-height: 28px;
  margin: 5% 7%;
}

.marokusatsu-result__main {
  width: 97%;
  padding: 1%;
  border: 3px solid black;
  margin: 5% auto;
}

.marokusatsu-result__main__contents {
  background-color: #fff;
  border: solid 1px #000;
  position: relative;
}

.marokusatsu-result__main__contents__text {
  text-align: center;
  font-size: 110%;
  font-weight: bold;
  line-height: 28px;
  margin: 5% 3%;
}

.marokusatsu-result__main__contents__age {
  text-align: center;
  font-size: 220%;
  font-weight: bold;
  color: #b71111;
  line-height: 28px;
  margin: 5% 3%;
}

.marokusatsu-result__calendar {
  background-color: #f8f4ed;
  width: 100%;
}

.marokusatsu-result__calendar__title {
  width: 80%;
  margin: 0 auto;
}

.marokusatsu-result__calendar__title p {
  font-size: 87%;
  text-align: center;
  color: #b71111;
  margin: 0 0 4%;
}

.marokusatsu-result__calendar__day-of-the-week {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.marokusatsu-result__calendar__day-of-the-week div {
  margin: 2% 0;
  background-color: white;
  text-align: center;
  width: 13.2857142857%;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.38);
}

.marokusatsu-result__calendar__day-of-the-week div p {
  font-size: 85%;
  padding: 6% 0;
}

.marokusatsu-result__calendar__items__item {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.marokusatsu-result__calendar__items__item__day {
  position: relative;
  width: 13.2857142857%;
  min-height: 4rem;
  background-color: white;
  margin-bottom: 1%;
  padding: 0 0 0.2rem 0;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.38);
}

.marokusatsu-result__calendar__items__item__day__icon {
  position: absolute;
  width: 20%;
  width: 70%;
  top: 11%;
  right: 15%;
}

.marokusatsu-result__calendar__items__item__day__number {
  font-size: 89%;
  text-align: center;
  color: #000;
  margin: 77% 0% 0% 50%;
}

.marokusatsu-result__calendar__guidance__title {
  margin: 3% 2% 0;
  padding: 3%;
  background-color: #01002a;
  color: #fff;
  text-align: center;
  font-weight: bold;
}

.marokusatsu-result__calendar__guidance__text {
  text-align: left;
  font-size: 85%;
  line-height: 28px;
  margin: 2% 7% 0;
  padding-bottom: 5%;
}

.may-lasthalf-campaign-2022-benefits {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8% 0;
}

.may-lasthalf-campaign-2022-benefits__pop {
  text-align: center;
  color: rgb(255, 85, 73);
  font-weight: 600;
  font-size: 130%;
}

.may-lasthalf-campaign-2022-benefits .head {
  padding: 3%;
}

.may-lasthalf-campaign-2022-benefits p {
  padding: 2% 3%;
  line-height: 150%;
}

.may-lasthalf-campaign-2022-benefits p.red {
  color: rgb(255, 85, 73);
  font-size: 110%;
  font-weight: 600;
}

.may-lasthalf-campaign-2022-benefits form {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.may-lasthalf-campaign-2022-benefits form button {
  padding: 3% 5%;
  font-size: 120%;
  border-radius: 15px;
  background-color: #01002a;
  color: #ffffff;
}

.may-lasthalf-campaign-2022-benefits button {
  padding: 3% 5%;
  margin: 2%;
  font-size: 120%;
  border-radius: 15px;
  background-color: #01002a;
}

.may-lasthalf-campaign-2022-benefits button a {
  color: #ffffff;
}

.june_campaign_2022_benefits {
  padding-bottom: 5%;
}

.june_campaign_2022_benefits__box {
  background-color: white;
  text-align: left;
  color: black;
  font-size: 100%;
  border-radius: 20px;
  margin: 0% 5% 8%;
  padding: 2% 0% 5%;
}

.june_campaign_2022_benefits__pop {
  text-align: center;
  color: rgb(255, 85, 73);
  font-weight: 600;
  font-size: 130%;
}

.june_campaign_2022_benefits__banner {
  padding: 5%;
}

.june_campaign_2022_benefits__title1 {
  color: #FF66FF;
  font-size: 120%;
  padding: 0% 5% 0%;
}

.june_campaign_2022_benefits__text {
  font-size: 100%;
  padding: 5% 5% 5%;
}

.june_campaign_2022_benefits__text.font_weight {
  font-weight: 900;
  text-shadow: 0 0 black;
}

.june_campaign_2022_benefits__btn {
  display: block;
  right: 0%;
  left: 0%;
  margin: 0 auto;
  width: 40%;
}

.june_campaign_2022_benefits__btn2 {
  right: 0;
  left: 0;
  margin: 0px auto;
  text-align: center;
  font-size: 100%;
  color: white;
  background-color: #000033;
  border-radius: 10px;
  width: 35%;
  padding: 3% 0% 3%;
}

.end_of_june_campaign_2022_benefits {
  padding-bottom: 5%;
}

.end_of_june_campaign_2022_benefits__box {
  background-color: white;
  text-align: left;
  color: black;
  font-size: 100%;
  border-radius: 20px;
  margin: 0% 5% 8%;
  padding: 2% 0% 5%;
}

.end_of_june_campaign_2022_benefits__box__pop {
  text-align: center;
  color: rgb(255, 85, 73);
  font-weight: 600;
  font-size: 130%;
}

.end_of_june_campaign_2022_benefits__box__banner {
  padding: 5%;
}

.end_of_june_campaign_2022_benefits__box__text {
  font-size: 100%;
  line-height: 160%;
  padding: 5% 5% 5%;
  font-weight: bold;
}

.end_of_june_campaign_2022_benefits__box__btn {
  display: block;
  right: 0%;
  left: 0%;
  margin: 0 auto;
  width: 40%;
}

.end_of_june_campaign_2022_benefits__box__btn2 {
  right: 0;
  left: 0;
  margin: 0px auto;
  text-align: center;
  font-size: 100%;
  color: white;
  background-color: #000033;
  border-radius: 10px;
  width: 35%;
  padding: 3% 0% 3%;
}

.end_of_june_campaign_2022_benefits__paid_box {
  text-align: left;
  background-color: white;
  color: #7B3302;
  box-shadow: 3px 3px 3px #ccc;
  padding: 5%;
  margin: 5%;
}

.end_of_june_campaign_2022_benefits__paid_box__title {
  position: relative;
  text-align: center;
  font-size: 150%;
  font-weight: bold;
  margin: 5% 0% 10%;
}

.end_of_june_campaign_2022_benefits__paid_box__title::after {
  content: "";
  position: absolute;
  display: block;
  right: 0;
  left: 0;
  margin: 0 auto;
  height: 3px;
  margin-top: 2%;
  background-color: #7B3302;
}

.end_of_june_campaign_2022_benefits__paid_box__text {
  padding: 0% 3% 5%;
}

.end_of_june_campaign_2022_benefits__paid_box__present_img {
  padding: 5%;
}

.end_of_june_campaign_2022_benefits__paid_box__btn {
  right: 0;
  left: 0;
  margin: 0px auto;
  text-align: center;
  font-size: 100%;
  color: white;
  background-color: #000033;
  border-radius: 10px;
  width: 45%;
  padding: 4% 0% 4%;
  margin-bottom: 10%;
}

.hide {
  position: relative;
}

.hide::before {
  content: "\8C6A\83EF\9451\5B9A\30C1\30B1\30C3\30C8\3092\6301\3063\3066\3044\307E\305B\3093";
  width: 100%;
  color: white;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 1;
}

.hide::after {
  content: "";
  display: block;
  background: rgba(0, 0, 0, 0.52);
  width: 100%;
  height: 105%;
  position: absolute;
  top: -2%;
}

.hide__return_btn {
  position: absolute;
  right: 0;
  left: 0;
  margin: 0px auto;
  text-align: center;
  font-size: 118%;
  color: white;
  background-color: #000033;
  border-radius: 10px;
  width: 45%;
  padding: 4% 0% 4%;
  top: 60%;
  z-index: 2;
}

.hide__return_btn.show {
  display: none;
}

.hide.show:before {
  display: none;
}

.hide.show:after {
  display: none;
}

.july_campaign_2022_benefits__box {
  background-color: white;
  text-align: left;
  color: black;
  font-size: 100%;
  border-radius: 20px;
  margin: 0% 5% 8%;
  padding: 2% 0% 5%;
}

.july_campaign_2022_benefits__pop {
  text-align: center;
  color: rgb(255, 85, 73);
  font-weight: 600;
  font-size: 130%;
}

.july_campaign_2022_benefits__banner {
  padding: 5%;
}

.july_campaign_2022_benefits__text {
  text-align: left;
  font-size: 100%;
  line-height: 150%;
  padding: 5% 5% 5%;
}

.july_campaign_2022_benefits__text_box {
  display: flex;
}

.july_campaign_2022_benefits__text_box__ticket {
  width: 25%;
  margin: 0% 3% 0% 5%;
}

.july_campaign_2022_benefits__text_box__text {
  padding: 9% 5% 0%;
}

.july_campaign_2022_benefits__text2 {
  text-align: center;
  font-size: 100%;
  padding: 0% 5% 5%;
  color: red;
}

.july_campaign_2022_benefits__text3 {
  text-align: center;
  font-size: 75%;
  padding: 4% 5% 5%;
  color: black;
}

.july_campaign_2022_benefits__menu-container {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  position: relative;
  background-color: white;
  color: black;
  margin: 5%;
  padding: 3% 2%;
}

.july_campaign_2022_benefits__menu-container__icon {
  width: 15%;
}

.july_campaign_2022_benefits__menu-container__name {
  width: 80%;
  margin: 0 3% 0 4%;
  font-size: 90%;
  line-height: 150%;
  text-decoration: underline;
  color: black;
}

.july_campaign_2022_benefits__menu-container__name.link-none {
  pointer-events: none;
  text-decoration: none;
  color: rgb(59, 66, 66);
}

.recommend_menus__title {
  color: white;
  font-size: 140%;
  padding: 3% 0;
  margin: 8% 0% 2%;
  background-color: #01002A;
  text-align: center;
}

.recommend_menus__body {
  margin: 0 3%;
}

.recommend_menus__list {
  margin: 3%;
  padding: 0.5rem;
  border: 1px solid #1d2946;
  background-color: #f9f9f9;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
}

.recommend_menus__list__item {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.july-present-campaign-2022-benefits {
  border: solid 2.5px #000;
  margin: 1.2rem;
}

.july-present-campaign-2022-benefits__container {
  background-color: white;
  margin: 1%;
  padding: 5%;
  border: solid 1px #000;
  font-weight: bold;
}

.july-present-campaign-2022-benefits__container__sub-title {
  text-align: center;
}

.july-present-campaign-2022-benefits__container__title {
  position: relative;
  text-align: center;
  color: #C00000;
  font-weight: bold;
  font-size: 150%;
  margin: 5% 0% 8%;
}

.july-present-campaign-2022-benefits__container__title::after {
  content: "";
  position: absolute;
  display: block;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 78vw;
  height: 1px;
  margin-top: 2%;
  background-color: black;
}

.july-present-campaign-2022-benefits__container__text {
  text-align: left;
}

.july-present-campaign-2022-benefits__container__sub-head {
  text-align: center;
  background-color: #FBE5D6;
  margin: 4% 0%;
  padding: 2%;
  border-radius: 6px;
}

.july-present-campaign-2022-benefits__container__present {
  display: flex;
  flex-direction: column;
}

.july-present-campaign-2022-benefits__container__present__box {
  background-color: white;
  margin: 8% 0% 8%;
  text-align: center;
  display: flex;
  flex-direction: column;
}

.july-present-campaign-2022-benefits__container__present__box__img {
  padding: 7%;
}

.july-present-campaign-2022-benefits__container__present__box__img-title {
  font-weight: bold;
  font-size: 120%;
}

.july-present-campaign-2022-benefits__container__present__box__title {
  display: flex;
  align-items: center;
}

.july-present-campaign-2022-benefits__container__present__box__title__alphabet-a {
  background-color: #f05757;
  color: #fffce7;
  font-size: 150%;
  padding: 2% 5% 3%;
  border-radius: 49%;
  width: 15%;
}

.july-present-campaign-2022-benefits__container__present__box__title__sub-title {
  text-align: center;
  padding: 2%;
  border-radius: 6px;
  width: 85%;
}

.july-present-campaign-2022-benefits__container__present__box__title__alphabet-b {
  background-color: #578bf0;
  color: #fffce7;
  font-size: 150%;
  padding: 2% 5% 3%;
  border-radius: 49%;
  width: 15%;
}

.july-present-campaign-2022-benefits__container__present__box__title__alphabet-c {
  background-color: #966d1e;
  color: #fffce7;
  font-size: 150%;
  padding: 2% 5% 3%;
  border-radius: 49%;
  width: 15%;
}

.july-present-campaign-2022-benefits__container__present__box__text {
  font-size: 100%;
  text-align: center;
}

.july-present-campaign-2022-benefits .btn {
  right: 0;
  left: 0;
  margin: 0px auto;
  margin-bottom: 5%;
  margin-top: 5%;
  text-align: center;
  font-size: 100%;
  color: white;
  background-color: #000033;
  border-radius: 10px;
  width: 51%;
  padding: 4% 0% 4%;
}

.july-present-campaign-2022-benefits span {
  color: #C00000;
}

.july-present-campaign-2022-benefits .center-text {
  text-align: center;
}

.submenu-results {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.submenu-results__top {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(to bottom, rgba(249, 244, 237, 0.1215686275), #f9f4ed 3%, #f9f4ed 96%, rgba(249, 244, 237, 0.1215686275));
  padding: 5% 0;
}

.submenu-results__top__title {
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 114%;
  font-weight: bold;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  display: flex;
  align-items: center;
}

.submenu-results__top__title img {
  width: 20%;
  margin-right: 7%;
}

.submenu-results__top__body {
  width: 85%;
  margin: 20px auto;
  color: #1d2946;
  font-size: 108%;
  line-height: 150%;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.submenu-results__introduction {
  color: #c00000;
  width: 100%;
  font-weight: 600;
  text-align: center;
  padding: 3% 0;
}

.ranking2023 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.ranking2023__summary {
  margin: 5%;
}

.ranking2023__summary__img {
  width: 65%;
  margin: 0 auto 5%;
}

.ranking2023__summary__text {
  font-weight: bold;
  font-size: 110%;
  line-height: 150%;
}

.ranking2023__rank {
  background-color: #f9f4ed;
}

.ranking2023__rank__text {
  font-size: 110%;
  font-weight: bold;
  padding: 6% 2% 0%;
  text-align: center;
  line-height: 150%;
}

.ranking2023__rank__text span {
  color: #C00000;
}

.ranking2023__rank__animation {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.ranking2023__rank__animation__background {
  width: 75%;
  border-radius: 50%;
}

.ranking2023__rank__animation__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.ranking2023__rank__animation__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.ranking2023__rank__animation__images__outline img {
  position: absolute;
}

.ranking2023__rank__animation__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.ranking2023__rank__animation__images__outline__left.slide {
  animation-name: slide-left;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.ranking2023__rank__animation__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.ranking2023__rank__animation__images__outline__right.slide {
  animation-name: slide-right;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.ranking2023__rank__animation__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
}

.ranking2023__rank__animation__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.ranking2023__rank__animation__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.ranking2023__rank__animation__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.ranking2023__rank__animation__text {
  text-align: center;
  font-size: 210%;
  font-weight: bold;
  margin: 5% 0 0;
}

.ranking2023__rank__animation__text span {
  font-size: 150%;
}

.ranking2023__rank__animation__text__red {
  color: #C00000;
}

.ranking2023__rank__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.ranking2023__rank__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.ranking2023__rank__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.ranking2023__rank__motif-text.show {
  opacity: 1;
}

.ranking2023__sub-menu {
  background-color: #f9f4ed;
}

.ranking2023__sub-menu__text {
  font-size: 110%;
  padding: 10% 10% 5%;
  font-weight: bold;
}

.ranking2023__calender-campaign {
  margin: 5% auto;
  width: 90%;
}

.ranking2023__calender-campaign__text {
  background-color: #f9f9f9;
  padding: 5% 4% 2%;
  margin-top: 4%;
}

.ranking2023__calender-campaign__text span {
  display: block;
  color: #C00000;
  margin: 3%;
  text-align: center;
}

.ranking2023__calender-campaign__text span a {
  text-decoration: underline;
}

.ranking2023__recommend-menu__items__item {
  margin: 5%;
  padding: 5%;
  border: 1px solid #1d2946;
  background-color: #f9f9f9;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
  display: flex;
}

.ranking2023__recommend-menu__items__item__icon {
  width: 31%;
  margin-right: 5%;
}

.ranking2023__recommend-menu__items__item__name {
  margin-top: 2%;
  text-decoration: underline;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.ranking2024 {
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
}

.ranking2024__summary {
  margin: 5%;
}

.ranking2024__summary__img {
  width: 65%;
  margin: 0 auto 5%;
}

.ranking2024__summary__text {
  font-weight: bold;
  font-size: 110%;
  line-height: 150%;
}

.ranking2024__rank {
  background-color: #f9f4ed;
}

.ranking2024__rank__text {
  font-size: 110%;
  font-weight: bold;
  padding: 6% 2% 0%;
  text-align: center;
  line-height: 150%;
}

.ranking2024__rank__text span {
  color: #c00000;
}

.ranking2024__rank__animation {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.ranking2024__rank__animation__background {
  width: 75%;
  border-radius: 50%;
}

.ranking2024__rank__animation__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
  z-index: 2;
}

.ranking2024__rank__animation__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.ranking2024__rank__animation__images__outline img {
  position: absolute;
}

.ranking2024__rank__animation__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.ranking2024__rank__animation__images__outline__left.slide {
  animation-name: slide-left;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.ranking2024__rank__animation__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.ranking2024__rank__animation__images__outline__right.slide {
  animation-name: slide-right;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.ranking2024__rank__animation__motif {
  z-index: 5;
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
}

.ranking2024__rank__animation__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.ranking2024__rank__animation__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.ranking2024__rank__animation__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.ranking2024__rank__animation__text {
  text-align: center;
  font-size: 210%;
  font-weight: bold;
  margin: 5% 0 0;
}

.ranking2024__rank__animation__text span {
  font-size: 150%;
}

.ranking2024__rank__animation__text__red {
  color: #c00000;
}

.ranking2024__rank__motif-text {
  width: 85%;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  transition: all 1500ms;
}

.ranking2024__rank__motif-text div {
  padding: 1rem;
  color: black;
  background-color: rgba(249, 244, 237, 0.5411764706);
}

.ranking2024__rank__motif-text div .result_text_css {
  font-size: 115%;
  color: #b71111;
}

.ranking2024__rank__motif-text.show {
  opacity: 1;
}

.ranking2024__sub-menu {
  background-color: #f9f4ed;
}

.ranking2024__sub-menu__text {
  font-size: 110%;
  padding: 10% 10% 5%;
  font-weight: bold;
}

.ranking2024__calender-campaign {
  margin: 5% auto;
  width: 90%;
}

.ranking2024__calender-campaign__text {
  background-color: #f9f9f9;
  padding: 5% 4% 2%;
  margin-top: 4%;
}

.ranking2024__calender-campaign__text span {
  display: block;
  color: #c00000;
  margin: 3%;
  text-align: center;
}

.ranking2024__calender-campaign__text span a {
  text-decoration: underline;
}

.ranking2024__recommend-menu__items__item {
  margin: 5%;
  padding: 5%;
  border: 1px solid #1d2946;
  background-color: #f9f9f9;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.5);
  display: flex;
}

.ranking2024__recommend-menu__items__item__icon {
  width: 31%;
  margin-right: 5%;
}

.ranking2024__recommend-menu__items__item__name {
  margin-top: 2%;
  text-decoration: underline;
}

@keyframes scale-up-with-fadeout-for-light {
  0% {
    opacity: 0;
    transform: scale(1);
  }

  20% {
    opacity: 1;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

@keyframes slide-left {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-37%);
  }
}

@keyframes slide-right {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(37%);
  }
}

.ranking-result__introduction {
  margin: 5% auto;
}

.ranking-result__introduction__teller {
  width: 65%;
  margin: 0% auto;
}

.ranking-result__introduction__text {
  width: 90%;
  margin: 0% auto;
  line-height: 1.5rem;
}

.ranking-result__introduction__text > p {
  margin-bottom: 5%;
  font-weight: bold;
}

.ranking-result__campaign {
  width: 90%;
  margin: 5% auto;
}

.ranking-result__campaign__notice {
  font-weight: bold;
  font-size: 120%;
  margin: 2% 0;
  text-align: center;
}

.ranking-result__campaign__banner {
  box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, 0.5);
}

.ranking-result__campaign__text {
  margin: 5% auto;
  padding: 5%;
  background-color: #fff;
  line-height: 1.4;
}

.ranking-result__campaign__text > a {
  display: block;
  text-align: center;
  color: #c00000;
  text-decoration: underline;
}

.ranking-result__campaign__text span {
  color: #c00000;
}

.ranking-result__recommend-menus {
  margin: 10% auto;
}

.ranking-result__motif {
  padding-top: 5%;
  width: 100%;
  font-family: "YuMincho", "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  overflow: hidden;
  background-color: #f9f4ed;
}

.ranking-result__motif__text {
  width: 85%;
  font-weight: bold;
  margin: 5% auto 0%;
  line-height: 1.5rem;
  text-align: center;
}

.ranking-result__motif__text > span {
  color: #c00000;
}

.ranking-result__motif__emperor-sign-new {
  position: relative;
  text-align: center;
  overflow: hidden;
}

.ranking-result__motif__emperor-sign-new__background {
  width: 75%;
  border-radius: 50%;
}

.ranking-result__motif__emperor-sign-new__images {
  position: absolute;
  top: 0;
  left: 12.5%;
  width: 75%;
  height: 100%;
  border-radius: 50%;
  border: 3px solid #d6b77e;
  overflow: hidden;
}

.ranking-result__motif__emperor-sign-new__images__outline {
  position: relative;
  width: 100%;
  height: 100%;
}

.ranking-result__motif__emperor-sign-new__images__outline img {
  position: absolute;
}

.ranking-result__motif__emperor-sign-new__images__outline__left {
  top: 0;
  left: 0;
  width: 50%;
}

.ranking-result__motif__emperor-sign-new__images__outline__left.slide {
  animation-name: ranking-slide-left;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.ranking-result__motif__emperor-sign-new__images__outline__right {
  top: 0;
  left: 50%;
  width: 50%;
}

.ranking-result__motif__emperor-sign-new__images__outline__right.slide {
  animation-name: ranking-slide-right;
  animation-duration: 0.6s;
  animation-fill-mode: forwards;
}

.ranking-result__motif__emperor-sign-new__motif {
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  opacity: 0;
}

.ranking-result__motif__emperor-sign-new__motif.show {
  transition: all 1.5s;
  opacity: 1;
}

.ranking-result__motif__emperor-sign-new__motif-text {
  width: 100%;
  opacity: 0;
  padding: 3% 0;
}

.ranking-result__motif__emperor-sign-new__motif-text.show {
  transition: all 1.5s;
  opacity: 1;
}

.ranking-result__motif__emperor-sign-new__rank-text {
  position: absolute;
  top: 0%;
  display: grid;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: all 1s ease-in-out;
}

.ranking-result__motif__emperor-sign-new__rank-text.show {
  opacity: 1;
}

.ranking-result__motif__emperor-sign-new__rank-text > p {
  padding-top: 17%;
  margin-left: 7%;
  font-weight: bold;
  font-size: 300%;
  width: 100%;
  text-shadow: 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white, 0 0 5px white;
}

.ranking-result__motif__emperor-sign-new__rank-text > p .\--rank-position1 {
  position: absolute;
  top: 50%;
  right: 56%;
}

.ranking-result__motif__emperor-sign-new__rank-text > p .\--rank-position2 {
  position: absolute;
  top: 50%;
  left: 45%;
}

.ranking-result__motif__emperor-sign-new__rank-text > p .\--color-red {
  color: #c00000;
}

.ranking-result__motif__emperor-sign-new__rank-text > p .\--size-small {
  font-size: 45%;
}

.ranking-result__motif__emperor-sign-new__rank-text > p .scaleUp {
  animation: ranking-scale-up 1s;
}

@keyframes ranking-slide-left {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-100%);
  }
}

@keyframes ranking-slide-right {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(100%);
  }
}

@keyframes ranking-scale-up {
  0% {
    transform: scale(1);
  }

  30% {
    transform: scale(1.15);
  }

  100% {
    transform: scale(1);
  }
}

.result__title__center {
  margin: 2% 0;
  font-size: 100%;
  display: flex;
  justify-content: center;
}

.result__title__center__icon {
  width: 20%;
}

.result__title__center__text {
  width: 75%;
  margin-left: 5%;
  font-size: 110%;
  line-height: 150%;
  color: #1d2946;
}

.result__title__center__text__price {
  font-size: 80%;
  text-align: right;
}

.result__title__center__text__price p {
  color: white;
  display: inline-block;
  margin-top: 1rem;
  padding: 0.1rem 0.5rem;
  border-radius: 0.5rem;
  background-color: #1d2946;
}

.result__profile__center {
  margin: -2% 0;
  padding: 2% 0;
  font-size: 120%;
}

.result__profile__center p {
  font-size: 90%;
  line-height: 180%;
  color: black;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.result__profile__center__title {
  border-bottom: 1px solid black;
}

.result__sub__menu__text-head {
  height: 2rem;
  margin-top: 0%;
  background: linear-gradient(180deg, rgba(226, 210, 163, 0), #f9f4ed);
}

.result__sub__menu__center {
  background-color: #f9f4ed;
  background-size: 100% auto;
  background-repeat: repeat-y;
  padding: 1rem 0;
  font-size: 120%;
}

.result__sub__menu__center .date-text {
  color: #c00000;
  text-align: center;
}

.result__sub__menu__title {
  position: relative;
  width: 85%;
  padding: 0.5rem;
  margin: 1rem auto;
  border-bottom: 1px solid black;
  border-top: 1px solid black;
  font-size: 95%;
  font-weight: bold;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
  display: flex;
  align-items: center;
}

.result__sub__menu__title img {
  width: 20%;
  margin-right: 7%;
}

.result__sub__menu__title__bar {
  width: 90%;
  margin-left: 5%;
}

.result__sub__menu__text {
  width: 85%;
  margin: 20px auto 10px;
  color: #1d2946;
  font-size: 90%;
  line-height: 150%;
  text-align: left;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.result__sub__menu__text .result_text_css {
  font-size: 106%;
  color: #b71111;
  font-weight: bold;
}

.result__sub__menu__text .date-text {
  color: red;
  text-align: center;
}

.result__sub__menu__link {
  color: #bf9000;
  text-decoration: underline;
  line-height: 150%;
  font-size: 100%;
}

.result__sub__menu__mosaic {
  position: relative;
  width: 100%;
  margin: 0 auto;
}

.result__sub__menu__mosaic img {
  width: 100%;
  margin: 0 auto;
  display: block;
}

.result__sub__menu__mosaic div {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  align-items: center;
  justify-content: center;
  display: flex;
  width: 100%;
  margin: 0 auto;
}

.result__sub__menu__mosaic div .next-btn {
  width: 57%;
}

.result__sub__menu__into {
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/guest/background.jpg");
  background-size: 100% auto;
  background-repeat: repeat-y;
}

.result__sub__menu__into__recommend__message {
  width: 100%;
  aspect-ratio: 1/0.63125;
  background-image: url("https://web-img.rensa.jp.net/images/capo/kinoshita-reon.jp/result/result_question_message_bg.png");
  background-size: 100% 100%;
}

.result__sub__menu__into__recommend__message__window {
  width: 60%;
  padding-top: 8rem;
}

.result__sub__menu__into__recommend__message__window__text {
  padding: 2%;
  margin: 2%;
  border: 1px solid black;
  border-radius: 14px;
  font-size: 100%;
  text-align: center;
  line-height: 150%;
  color: white;
  background-color: rgba(0, 0, 0, 0.4901960784);
  font-family: "\FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.result__sub__menu__text-bottom {
  height: 3rem;
  margin-top: 0%;
  background: linear-gradient(0deg, rgba(226, 210, 163, 0), #f9f4ed);
}

.result__applisal-information {
  width: 95%;
  margin: 1.4rem auto;
  border: 2px solid black;
  padding: 0.2rem;
}

.result__applisal-information__inner-frame {
  padding: 1rem;
  border: 1px solid black;
  background-color: #faf4ed;
}

.result__applisal-information__item {
  position: relative;
  width: 90%;
  margin: 0.5rem auto;
  display: flex;
  justify-content: center;
}

.result__applisal-information__item__icon {
  width: 1.3rem;
  height: 1.3rem;
  aspect-ratio: 1/1;
  margin-top: 5%;
}

.result__applisal-information__item__text {
  width: calc(100% - 2rem);
  margin-left: 0.5rem;
  font-size: 100%;
  line-height: 1.5rem;
  color: #1d2946;
  word-break: break-all;
  font-family: "Yu Gothic UI Semibold , \FF2D\FF33   \FF30\660E\671D", "MS PMincho", "\30D2\30E9\30AE\30CE\660E\671D   Pro W3", "Hiragino Mincho Pro", serif;
}

.result__applisal-information__border {
  width: 80%;
  height: 1px;
  margin: 0.8rem 10%;
  background-color: rgba(0, 0, 0, 0.2);
}

.dev-sub-menu-key {
  position: absolute;
  top: 0;
  opacity: 20%;
  font-size: 12px;
}

.result_text_css {
  font-size: 115%;
  color: #b71111;
  font-weight: bold;
}

.bookmark__button {
  width: 65%;
  margin-bottom: 1%;
  padding: 8px;
  border-radius: 4px;
  border: 1px solid rgba(98, 70, 59, 0.567);
  letter-spacing: 1px;
  text-shadow: 0;
  text-align: center;
  background-color: white;
  font-size: 80%;
  cursor: pointer;
  transition: all 0.4s ease;
  position: relative;
}

.bookmark__button.unsaved {
  color: black;
}

.bookmark__button:active {
  letter-spacing: 2px;
}

.bookmark__button.saved {
  color: white;
  background-color: gray;
}

.bookmark__button:after {
  position: absolute;
  top: 25%;
  right: 0;
  font-size: 100%;
  content: "\3009";
  color: white;
}

.bookmark__button.onclic {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border-width: 3px;
  font-size: 0;
  border-left-color: white;
  animation: rotate 2s 0.25s linear infinite;
}

.bookmark__button.onclic:after {
  content: "";
}

.bookmark__button.onclic:hover {
  background: white;
}

.bookmark-center {
  text-align: center;
  overflow: hidden;
}

.result__applisal__btn {
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 75%;
  display: block;
}

.result__applisal__btn__img {
  width: 100%;
  padding: 0% 17% 17% 17%;
}