/*! Writen  by SCSS */
#mainvisual.moving *,
#mainvisual.moving :before,
#mainvisual.moving :after {
  transition: 0s all ease-in-out 0.5s !important; }

#mainvisual.moving:after {
  opacity: 1 !important;
  transition: 0.4s all ease-in-out 0s !important; }

.mainvisual {
  position: relative;
  z-index: 2;
  background: #FFF;
  overflow: hidden; }
  .mainvisual:after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    background: #FFF;
    z-index: 10;
    transition: 0.4s opacity linear 0s; }
  .mainvisual .main_in {
    aspect-ratio: 2/1;
    position: relative; }
    @media screen and (max-width: 480px) {
      .mainvisual .main_in {
        aspect-ratio: 414/600; } }
    .mainvisual .main_in .inset {
      position: absolute;
      inset: 0; }
    .mainvisual .main_in .movie_group {
      opacity: 0;
      transition: 1.5s opacity ease-in-out 0s,1.5s filter ease-in-out 0s;
      filter: brightness(300%); }
      .mainvisual .main_in .movie_group video {
        min-width: 100%;
        min-height: 100%;
        max-width: 1920px;
        width: auto;
        height: auto;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%); }
    .mainvisual .main_in .maincopy {
      position: absolute;
      inset: 0;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      transition: 2.5s opacity cubic-bezier(0.75, 0, 0.25, 1) 0s, 2.5s filter cubic-bezier(0.75, 0, 0.25, 1) 0s;
      font-size: clamp(20px, 2.25vw, 36px);
      letter-spacing: 0.05em;
      display: flex;
      justify-content: center;
      align-items: center;
      opacity: 0;
      filter: blur(10px); }
      @media screen and (max-width: 480px) {
        .mainvisual .main_in .maincopy {
          font-size: 6.2vw; } }
    .mainvisual .main_in .main_title_group {
      display: flex;
      justify-content: center;
      align-items: center; }
      .mainvisual .main_in .main_title_group .main_title_in {
        max-width: 145px;
        margin-left: 2.5%;
        position: relative; }
        @media screen and (max-width: 480px) {
          .mainvisual .main_in .main_title_group .main_title_in {
            margin-left: 6.5%; } }
        .mainvisual .main_in .main_title_group .main_title_in .main_title {
          position: relative; }
          .mainvisual .main_in .main_title_group .main_title_in .main_title .main_title_img {
            opacity: 0;
            transition: 1.5s opacity ease-in-out 0s; }
            .mainvisual .main_in .main_title_group .main_title_in .main_title .main_title_img.white {
              position: absolute;
              left: 0;
              top: 0;
              opacity: 0; }
        .mainvisual .main_in .main_title_group .main_title_in .main_load {
          position: absolute;
          inset: 0;
          left: -19%;
          top: auto;
          bottom: 46.5%;
          display: flex;
          justify-content: center;
          align-items: center;
          margin: auto;
          aspect-ratio: 35/34;
          width: 24.83%; }
          .mainvisual .main_in .main_title_group .main_title_in .main_load span {
            position: absolute;
            line-height: 0;
            opacity: 0;
            display: block;
            transition: 1s opacity ease-in-out 0s; }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(1) {
              transition-delay: 0s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(1) {
                  transition-delay: 0s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(2) {
              transition-delay: 0.4s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(2) {
                  transition-delay: 0.4s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(3) {
              transition-delay: 0.8s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(3) {
                  transition-delay: 0.8s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(4) {
              transition-delay: 1.2s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(4) {
                  transition-delay: 1.2s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(5) {
              transition-delay: 1.6s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(5) {
                  transition-delay: 1.6s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(6) {
              transition-delay: 2s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(6) {
                  transition-delay: 2s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(7) {
              transition-delay: 2.4s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(7) {
                  transition-delay: 2.4s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(8) {
              transition-delay: 2.8s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(8) {
                  transition-delay: 2.8s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(9) {
              transition-delay: 3.2s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(9) {
                  transition-delay: 3.2s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(10) {
              transition-delay: 3.6s; }
              @media screen and (max-width: 480px) {
                .mainvisual .main_in .main_title_group .main_title_in .main_load span:nth-of-type(10) {
                  transition-delay: 3.6s; } }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span.img01 {
              inset: 0;
              display: flex;
              justify-content: center;
              align-items: center;
              width: 16.67%;
              margin: auto; }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span.img02 {
              left: 3%;
              top: 17.5%;
              width: 41.67%; }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span.img03 {
              left: 25.3%;
              top: -3.5%;
              width: 47.23%; }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span.img04 {
              right: 2.7%;
              top: 17.5%;
              width: 47.23%; }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span.img05 {
              right: 10%;
              bottom: 3%;
              width: 38.89%; }
            .mainvisual .main_in .main_title_group .main_title_in .main_load span.img06 {
              left: 10%;
              bottom: 4%;
              width: 50%; }
    .mainvisual .main_in .main_slider_group:before {
      content: "";
      position: absolute;
      inset: 0;
      background: #FFF;
      opacity: 0;
      transition: 1s opacity ease-in-out 0s; }
    .mainvisual .main_in .main_slider_group .main_slide {
      position: absolute;
      inset: 0;
      opacity: 0;
      transition: 1s opacity ease-in-out 0s; }
      .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide {
        position: relative;
        width: 100%;
        height: 100%; }
        .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image {
          position: absolute;
          inset: 0; }
          .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image:before {
            content: "";
            position: absolute;
            inset: 0;
            background-position: top center;
            background-repeat: no-repeat;
            background-size: cover; }
          .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main01:before {
            background-image: url("../images/top/main/main_image01.jpg"); }
            @media screen and (max-width: 480px) {
              .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main01:before {
                background-image: url("../images/top/main/main_image01_sp.jpg"); } }
          .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main02:before {
            background-image: url("../images/top/main/main_image02.jpg"); }
            @media screen and (max-width: 480px) {
              .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main02:before {
                background-image: url("../images/top/main/main_image02_sp.jpg"); } }
          .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main03:before {
            background-image: url("../images/top/main/main_image03.jpg"); }
            @media screen and (max-width: 480px) {
              .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main03:before {
                background-image: url("../images/top/main/main_image03_sp.jpg"); } }
          .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main04:before {
            background-image: url("../images/top/main/main_image04.jpg"); }
            @media screen and (max-width: 480px) {
              .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main04:before {
                background-image: url("../images/top/main/main_image04_sp.jpg"); } }
          .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main05:before {
            background-image: url("../images/top/main/main_image05.jpg"); }
            @media screen and (max-width: 480px) {
              .mainvisual .main_in .main_slider_group .main_slide .swiper-wrapper .swiper-slide .main_image.main05:before {
                background-image: url("../images/top/main/main_image05_sp.jpg"); } }
    .mainvisual .main_in .main_slider_group .main_title_group02 {
      z-index: 2; }
      .mainvisual .main_in .main_slider_group .main_title_group02 .main_read {
        opacity: 0;
        transform: translateY(30px);
        transition: 3s opacity ease-in-out 0s,3s transform ease-in-out 0s;
        position: absolute;
        inset: 0;
        top: 8.75%;
        bottom: auto;
        width: 8.57%;
        max-width: 137px;
        margin: 0 auto; }
        @media screen and (max-width: 480px) {
          .mainvisual .main_in .main_slider_group .main_title_group02 .main_read {
            top: 13.34%;
            width: 24%;
            margin: 0 auto; } }
        @media screen and (max-width: 480px) {
          .mainvisual .main_in .main_slider_group .main_title_group02 .main_read img {
            width: 100%; } }
      .mainvisual .main_in .main_slider_group .main_title_group02 .main_title02 {
        opacity: 0;
        transform: translateX(-30px);
        transition: 3s opacity ease-in-out 0s,3s transform ease-in-out 0s;
        position: absolute;
        width: 30.94%;
        max-width: 495px;
        left: 1.25%;
        bottom: 2.5%; }
        @media screen and (max-width: 820px) {
          .mainvisual .main_in .main_slider_group .main_title_group02 .main_title02 {
            width: 40%; } }
        @media screen and (max-width: 480px) {
          .mainvisual .main_in .main_slider_group .main_title_group02 .main_title02 {
            right: 0;
            left: 0;
            width: 95%;
            bottom: 5px;
            margin: 0 auto;
            transform: translateY(-20px); } }
    .mainvisual .main_in .main_slider_group .main_progress {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 3px;
      z-index: 5;
      pointer-events: none; }
      .mainvisual .main_in .main_slider_group .main_progress .bar {
        display: block;
        width: 0%;
        height: 100%;
        background: #ec694d;
        opacity: 0;
        transition: 0s width linear,opacity 0.25s ease; }
  .mainvisual .main_button {
    z-index: 5;
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 70px;
    border: 1px solid #FFF;
    border-radius: 5px;
    text-align: center;
    background: #ec694d;
    cursor: pointer;
    color: #FFF;
    font-size: 13px;
    line-height: 1;
    padding: 8px 0 6px; }
    @media screen and (max-width: 480px) {
      .mainvisual .main_button {
        width: 50px;
        font-size: 10px;
        bottom: auto;
        right: 10px;
        padding: 5px 0;
        top: 70px; } }
    .mainvisual .main_button .replay {
      opacity: 0;
      pointer-events: none;
      transition: 0.3s opacity ease-out 0s; }
    .mainvisual .main_button .skip {
      position: absolute;
      inset: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: auto;
      transition: 0.3s opacity ease-out 0s; }

#mainvisual.main_end .main_button .replay {
  opacity: 1;
  pointer-events: all; }
#mainvisual.main_end .main_button .skip {
  opacity: 0;
  pointer-events: none; }
#mainvisual.load01 .maincopy {
  opacity: 1;
  filter: blur(0); }
#mainvisual.load02 .maincopy {
  opacity: 0;
  filter: blur(10px); }
#mainvisual.load03 .main_in .main_title_group .main_title_in .main_load span {
  opacity: 1; }
#mainvisual.load04 .main_in .main_load .main_title .main_title_img.basic {
  opacity: 1; }
#mainvisual.load05 .main_in .movie_group {
  opacity: 1;
  filter: brightness(100%); }
#mainvisual.load05 .main_in .main_load .main_title .main_title_img.basic {
  opacity: 0; }
#mainvisual.load05 .main_in .main_load .main_title .main_title_img.white {
  opacity: 1; }
#mainvisual.s01 .main_in .main_slider_group:before {
  opacity: 1; }
#mainvisual.s01 .main_in .main_slider_group .main_slide {
  opacity: 1; }
#mainvisual.s02 .main_in .main_slider_group .main_title_group02 .main_read {
  opacity: 1;
  transform: translateY(0); }
#mainvisual.s02 .main_in .main_slider_group .main_title_group02 .main_title02 {
  opacity: 1;
  transform: translateX(0); }
  @media screen and (max-width: 480px) {
    #mainvisual.s02 .main_in .main_slider_group .main_title_group02 .main_title02 {
      transform: translateY(0); } }

/*# sourceMappingURL=mainvisual.css.map */