/*! Writen  by SCSS */
.mainvisual {
  position: relative;
  overflow: hidden;
  background: #FFF; }
  body.ready .mainvisual .main_image:before {
    opacity: 1;
    filter: brightness(100%);
    transform: scale(1); }
  .mainvisual .main_image {
    aspect-ratio: 19.2/10;
    position: relative; }
    @media screen and (max-width: 480px) {
      .mainvisual .main_image {
        aspect-ratio: 414/700; } }
    .mainvisual .main_image:before {
      content: "";
      position: absolute;
      inset: 0;
      background-position: top center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../images/top/main/main_image01.webp");
      opacity: 0;
      filter: brightness(200%);
      transform: scale(1.2);
      transition: 3s opacity ease-in-out 0s,5s filter ease-in-out 0s,15s transform ease-in-out 0s; }
      @media screen and (max-width: 480px) {
        .mainvisual .main_image:before {
          background-image: url("../images/top/main/main_image01_sp.webp"); } }
  .mainvisual .main_copy_group {
    position: absolute;
    right: 5.73%;
    top: 18%;
    z-index: 5;
    font-size: clamp(15px, 1.875vw, 30px);
    color: #FFF;
    column-gap: clamp(25px, 2.5vw, 40px);
    flex-direction: row-reverse;
    justify-content: flex-start;
    /*
    opacity: 0;
    transform:scale(1.3);
    transition:2s opacity ease-in-out 2s,2s transform ease-in-out 2s;
    body.ready &{
    	opacity: 1;
    	transform:scale(1);
    }
    
    */ }
    @media screen and (max-width: 1200px) {
      .mainvisual .main_copy_group {
        top: 110px; } }
    @media screen and (max-width: 820px) {
      .mainvisual .main_copy_group {
        top: 85px; } }
    @media screen and (max-width: 480px) {
      .mainvisual .main_copy_group {
        top: 75px;
        column-gap: 15px;
        right: 15px;
        font-size: 20px; } }
    .mainvisual .main_copy_group .main_copy {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      flex-direction: column;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl;
      color: #FFF;
      line-height: 1.4; }
      .mainvisual .main_copy_group .main_copy .big {
        font-size: 266%;
        line-height: 1.4;
        letter-spacing: 0.2em; }
        @media screen and (max-width: 480px) {
          .mainvisual .main_copy_group .main_copy .big {
            font-size: 200%; } }
      .mainvisual .main_copy_group .main_copy .sub {
        line-height: 2;
        letter-spacing: 0.15em; }

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