#top_slider {
  width: 100%;
  padding: 8em 0px 2em;
  overflow: hidden;
  background-image: url(../img/0niji_bg.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat; }
#top_slider .top-wrapper {
  display: flex;
  width: max-content;
  margin: 0 auto;
  position: relative; }
@media screen and (max-width: 1024px) {
  #top_slider .top-wrapper {
    width: 95%;
    justify-content: space-between; } }
#top_slider .top-wrapper:after {
  position: absolute;
  bottom: 0;
  right: 0;
  content: '';
  display: block;
  width: 400px;
  aspect-ratio: 600/400;
  background-image: url(../img/0hana_bg.png);
  background-size: 100%; }
@media screen and (max-width: 1024px) {
  #top_slider .top-wrapper:after {
    width: 300px;
    bottom: -2em; } }
@media screen and (max-width: 767px) {
  #top_slider .top-wrapper:after {
    width: 100%;
    bottom: -6em; } }
#top_slider .top-slide {
  width: calc(100vw / 5);
  aspect-ratio: 9/16;
  margin: 0 0.6em;
  position: relative; }
#top_slider .top-slide img {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: calc(100vw / 10) calc(100vw / 10) 1em 1em;
  outline: 4px solid #fff;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  vertical-align: top;
  transition: 1s;
  opacity: 0;
  box-shadow: 4px 4px 10px #b1c2fa; }
@media screen and (max-width: 767px) {
  #top_slider .top-slide img {
    outline: 0px solid #fff; } }
#top_slider .top-slide img.act {
  opacity: 1; }
#top_slider .slide-left {
  margin: 0 calc(100vw / 3) 0 0; }
@media screen and (max-width: 1024px) {
  #top_slider .slide-left {
    margin: 0; } }
@media screen and (max-width: 767px) {
  #top_slider .slide-left {
    margin: 0 auto;
    width: 80%;
    aspect-ratio: 10/16; }
  #top_slider .slide-left img {
    border-radius: calc(100vw / 1) calc(100vw / 1) 1em 1em; } }
#top_slider .slide-center:before {
  position: absolute;
  top: -2em;
  right: -3em;
  content: '';
  display: block;
  width: 200px;
  aspect-ratio: 640/480;
  background-image: url(../img/anime/tori_anime.gif);
  background-size: 100%;
  z-index: 3; }
@media screen and (max-width: 1024px) {
  #top_slider .slide-center:before {
    width: 150px; } }
#top_slider .slide-left:before {
  position: absolute;
  bottom: -2em;
  right: -3em;
  content: '';
  display: block;
  width: 200px;
  aspect-ratio: 640/480;
  background-image: url(../img/anime/tori_anime2.gif);
  background-size: 100%;
  z-index: 3; }
@media screen and (max-width: 1024px) {
  #top_slider .slide-left:before {
    width: 110px; } }
@media screen and (max-width: 767px) {
  #top_slider .slide-left:before {
    right: auto;
    left: -3em;
    width: 130px; } }
@media screen and (max-width: 767px) {
  #top_slider .slide-left:after {
    position: absolute;
    top: -1em;
    right: -2em;
    content: '';
    display: block;
    width: 150px;
    aspect-ratio: 640/480;
    background-image: url(../img/anime/tori_anime.gif);
    background-size: 100%;
    z-index: 3; } }
@media screen and (max-width: 1024px) {
  #top_slider .slide-right {
    display: none; } }

#top_slider.pctab {
  display: block; }
@media screen and (max-width: 767px) {
  #top_slider.pctab {
    display: none; } }

#top_slider.phone {
  display: none; }
@media screen and (max-width: 767px) {
  #top_slider.phone {
    display: block;
    padding: 5em 0px 0em;
    overflow: initial;
    background-position: 15% bottom;
    background-size: 1000px; } }

header#olign {
  padding: 0 0 120px;
  height: initial; }
@media screen and (max-width: 767px) {
  header#olign {
    padding: 0 0 60px; } }

header#olign .catch.top_page {
  right: 23vw; }
@media screen and (max-width: 1024px) {
  header#olign .catch.top_page {
    right: 0; } }

header#olign .top_content, header#olign .catch, .global_nav {
  z-index: 2; }

@media screen and (max-width: 767px) {
  .top_pick_up h3 {
    display: block; } }

.js_obj {
  opacity: 0;
  transform: translate(0px, 30px);
  transition: 1s; }

.js_obj.anima_btm {
  transform: translate(0px, 30px); }

.js_obj.anima_lef {
  transform: translate(30px, 0px); }

.js_obj.anima_rig {
  transform: translate(-30px, 0px); }

.js_obj.act {
  opacity: 1;
  transform: translate(0px, 0px); }

main .inner .faq_box {
  position: relative; }

.faq_anime {
  width: 200px;
  aspect-ratio: 300/400;
  position: absolute;
  bottom: -10em;
  right: -4em;
  animation: loop_rotate 4s ease infinite; }
@media screen and (max-width: 1024px) {
  .faq_anime {
    width: 150px;
    right: 0em; } }
@media screen and (max-width: 767px) {
  .faq_anime {
    bottom: 0; } }

@media screen and (max-width: 767px) {
  main .inner .faq_box {
    padding: 0 0 180px; } }
@keyframes loop_rotate {
  0% {
    transform: rotate(0deg); }
  25% {
    transform: rotate(10deg); }
  50% {
    transform: rotate(0deg); }
  75% {
    transform: rotate(-10deg); }
  100% {
    transform: rotate(0deg); } }
.add_image {
  position: relative; }

.add_image:before {
  content: '';
  display: block;
  background-image: url(../img/anime/flow_anime.gif);
  background-size: 100%;
  background-repeat: no-repeat;
  width: 150px;
  aspect-ratio: 300/400;
  position: absolute;
  top: -200px;
  left: -3em;
  animation: loop_rotate 4s ease infinite; }
@media screen and (max-width: 767px) {
  .add_image:before {
    width: 100px;
    top: -150px;
    left: auto;
    right: -1em; } }