/*! Writen  by SCSS */
body .wrap {
  overflow: visible; }
  @media screen and (max-width: 480px) {
    body .wrap {
      overflow: hidden; } }

.information_area {
  margin-top: 1px; }
  .information_area .infor_in {
    position: relative;
    align-items: flex-start; }
    @media screen and (max-width: 480px) {
      .information_area .infor_in {
        flex-direction: column; } }
    .information_area .infor_in .bg_layer {
      position: absolute;
      inset: 0;
      z-index: -1; }
      @media screen and (max-width: 480px) {
        .information_area .infor_in .bg_layer {
          display: none; } }
      .information_area .infor_in .bg_layer .bg_layer_in {
        position: absolute;
        inset: 0;
        width: 43.75%;
        background-position: top center;
        background-repeat: no-repeat;
        background-size: cover;
        background-image: url("../images/top/bg_infor.jpg"); }
  .information_area .infor_l {
    position: sticky;
    left: 0;
    top: 50px;
    width: 43.75%;
    padding-top: 110px;
    overflow: hidden; }
    @media screen and (max-width: 480px) {
      .information_area .infor_l {
        position: static;
        width: 100%;
        padding: 40px 0;
        background-position: top center;
        background-repeat: no-repeat;
        background-size: cover;
        background-image: url("../images/top/bg_infor_sp.jpg"); } }
    .information_area .infor_l .infor_group {
      position: relative;
      padding-left: 11.43%;
      padding-right: 30px;
      padding-bottom: 80px; }
      @media screen and (max-width: 820px) {
        .information_area .infor_l .infor_group {
          padding-left: 10%; } }
      @media screen and (max-width: 480px) {
        .information_area .infor_l .infor_group {
          padding: 0;
          width: calc(100% - 60px);
          margin: 0 auto;
          text-align: center; } }
      .information_area .infor_l .infor_group .infor_ttl {
        font-size: clamp(12px, 1vw, 16px);
        margin-bottom: 10px; }
      .information_area .infor_l .infor_group .raise_txt {
        display: flex;
        flex-direction: column;
        row-gap: 10px;
        width: fit-content;
        font-size: clamp(18px, 1.875vw, 30px);
        line-height: 1.8;
        padding-bottom: 30px;
        margin-bottom: 30px;
        position: relative; }
        @media screen and (max-width: 480px) {
          .information_area .infor_l .infor_group .raise_txt {
            font-size: 5.5vw; } }
        .information_area .infor_l .infor_group .raise_txt:before {
          content: "";
          position: absolute;
          inset: 0;
          top: auto;
          background: rgba(0, 0, 0, 0.3);
          width: 50%;
          height: 1px; }
          @media screen and (max-width: 480px) {
            .information_area .infor_l .infor_group .raise_txt:before {
              margin: auto; } }
        .information_area .infor_l .infor_group .raise_txt .sub {
          line-height: 1.6; }
        .information_area .infor_l .infor_group .raise_txt .big {
          display: block;
          font-size: 246%;
          line-height: 1;
          text-indent: -0.1em; }
          @media screen and (max-width: 480px) {
            .information_area .infor_l .infor_group .raise_txt .big {
              text-indent: 0; } }
      .information_area .infor_l .infor_group .raise_txt02 {
        font-size: clamp(28px, 2.875vw, 46px);
        line-height: 1.3; }
        @media screen and (max-width: 480px) {
          .information_area .infor_l .infor_group .raise_txt02 {
            font-size: 9.8vw; } }
      .information_area .infor_l .infor_group .site_btn_group {
        max-width: 225px;
        margin-top: 25px;
        flex-direction: column;
        row-gap: 20px; }
        @media screen and (max-width: 480px) {
          .information_area .infor_l .infor_group .site_btn_group {
            margin: 25px auto 0; } }
        .information_area .infor_l .infor_group .site_btn_group .site_btn {
          border-radius: 22px;
          padding: 8px 5px 11px; }
          @media screen and (max-width: 480px) {
            .information_area .infor_l .infor_group .site_btn_group .site_btn {
              padding: 12px 5px 14px; } }
          .information_area .infor_l .infor_group .site_btn_group .site_btn .link_txt {
            font-size: clamp(14px, 1.125vw, 18px); }
            @media screen and (max-width: 480px) {
              .information_area .infor_l .infor_group .site_btn_group .site_btn .link_txt {
                font-size: 18px; } }
  .information_area .infor_r {
    width: 56.25%; }
    @media screen and (max-width: 480px) {
      .information_area .infor_r {
        width: 100%; } }
    .information_area .infor_r .image_group {
      background: #FFF;
      flex-wrap: wrap;
      row-gap: 1px; }
      .information_area .infor_r .image_group .image {
        width: 50%;
        position: relative; }
        .information_area .infor_r .image_group .image.full {
          width: 100%; }
        .information_area .infor_r .image_group .image.border:after {
          content: "";
          position: absolute;
          inset: 0;
          left: auto;
          display: block;
          background: #FFF;
          width: 1px;
          height: 100%; }
        .information_area .infor_r .image_group .image img {
          width: 100%; }
    .information_area .infor_r .only_i_group {
      padding: 50px 0;
      background-position: top center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("../images/top/bg_onlyi.jpg"); }
      .information_area .infor_r .only_i_group .only_i_in .only_title_group {
        justify-content: center;
        align-items: center;
        column-gap: 20px; }
        @media screen and (max-width: 480px) {
          .information_area .infor_r .only_i_group .only_i_in .only_title_group {
            column-gap: 12px; } }
        @media screen and (max-width: 820px) {
          .information_area .infor_r .only_i_group .only_i_in .only_title_group .only_logo {
            width: 150px; } }
        @media screen and (max-width: 480px) {
          .information_area .infor_r .only_i_group .only_i_in .only_title_group .only_logo {
            width: 100px; } }
        .information_area .infor_r .only_i_group .only_i_in .only_title_group .only_title {
          flex-direction: column;
          row-gap: 5px;
          font-size: clamp(14px, 1.625vw, 26px); }
          @media screen and (max-width: 480px) {
            .information_area .infor_r .only_i_group .only_i_in .only_title_group .only_title {
              font-size: 3.6vw; } }
          .information_area .infor_r .only_i_group .only_i_in .only_title_group .only_title .cinzel {
            font-size: 176%;
            line-height: 1; }
      .information_area .infor_r .only_i_group .only_i_in .only_read {
        margin: clamp(20px, 1.875vw, 30px) 0 clamp(30px, 2.5vw, 40px);
        font-size: clamp(12px, 1.125vw, 18px);
        text-align: center; }
        @media screen and (max-width: 480px) {
          .information_area .infor_r .only_i_group .only_i_in .only_read {
            font-size: 4vw; } }
        .information_area .infor_r .only_i_group .only_i_in .only_read .small {
          font-size: clamp(10px, 0.75vw, 12px); }
          @media screen and (max-width: 480px) {
            .information_area .infor_r .only_i_group .only_i_in .only_read .small {
              font-size: 12px; } }
      .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_ttl {
        width: fit-content;
        margin: 0 auto 20px;
        padding: 9px 20px 11px;
        background: #990e1f;
        border-radius: 23px;
        font-size: clamp(14px, 1.5vw, 24px);
        color: #FFF;
        line-height: 1; }
        @media screen and (max-width: 480px) {
          .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_ttl {
            font-size: 16px; } }
      .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group {
        justify-content: center;
        column-gap: 20px;
        align-items: center;
        color: #990e1f; }
        @media screen and (max-width: 480px) {
          .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group {
            column-gap: 12px; } }
        .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group .vari_text {
          font-size: clamp(14px, 1.5vw, 24px);
          line-height: 1.4; }
          @media screen and (max-width: 480px) {
            .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group .vari_text {
              font-size: 3.4vw; } }
        .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group .vari_num {
          font-size: clamp(21px, 2.5vw, 40px); }
          @media screen and (max-width: 480px) {
            .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group .vari_num {
              font-size: 5.4vw; } }
          .information_area .infor_r .only_i_group .only_i_in .only_varietion .vari_num_group .vari_num .cinzel {
            display: inline-block;
            font-size: 225%;
            line-height: 1; }
      .information_area .infor_r .only_i_group .only_i_in .link_onlyi {
        display: flex;
        justify-content: center;
        column-gap: 15px;
        max-width: 540px;
        margin: 0 auto;
        padding: 25px 10px;
        background: #d7122a;
        border-radius: 5px;
        font-size: 20px;
        color: #FFF; }
        @media screen and (max-width: 480px) {
          .information_area .infor_r .only_i_group .only_i_in .link_onlyi {
            padding: 15px 10px;
            font-size: 4.2vw; } }
        body:not(.mobile) .information_area .infor_r .only_i_group .only_i_in .link_onlyi:hover .detail {
          transform: scale(0.5, 1) translateX(10px); }
        .information_area .infor_r .only_i_group .only_i_in .link_onlyi .detail {
          transform: scale(0.5, 1);
          transition: 0.3s transform ease-in-out 0s; }

.concept_area {
  position: relative;
  padding: clamp(100px, 15vw, 180px) 0;
  overflow: hidden; }
  @media screen and (max-width: 480px) {
    .concept_area {
      padding: 70px 0 60px; } }
  .concept_area #concept_movie {
    position: absolute;
    inset: 0;
    top: -10%;
    bottom: -10%;
    height: 120%;
    pointer-events: none; }
  .concept_area .concept_in {
    position: relative;
    text-align: center;
    color: #FFF;
    letter-spacing: 0.1em; }
    .concept_area .concept_in .concept_ttl_group {
      flex-direction: column;
      row-gap: 10px;
      margin-bottom: clamp(40px, 5vw, 60px); }
      .concept_area .concept_in .concept_ttl_group .concept_ttl {
        font-size: clamp(26px, 3.334vw, 40px);
        line-height: 1.4; }
        @media screen and (max-width: 480px) {
          .concept_area .concept_in .concept_ttl_group .concept_ttl {
            line-height: 1.6; } }
        .concept_area .concept_in .concept_ttl_group .concept_ttl .big {
          display: block;
          font-size: 225%;
          line-height: 1; }
          @media screen and (max-width: 480px) {
            .concept_area .concept_in .concept_ttl_group .concept_ttl .big {
              line-height: 1.1; } }
      .concept_area .concept_in .concept_ttl_group .concept_sub {
        font-size: clamp(24px, 3vw, 36px);
        line-height: 1.4; }
    .concept_area .concept_in .concept_read_group {
      flex-direction: column;
      row-gap: 40px; }
      @media screen and (max-width: 480px) {
        .concept_area .concept_in .concept_read_group {
          row-gap: 30px; } }
      .concept_area .concept_in .concept_read_group .concept_read {
        font-size: clamp(13px, 1.5vw, 18px); }
        @media screen and (max-width: 480px) {
          .concept_area .concept_in .concept_read_group .concept_read {
            font-size: 2.8vw;
            line-height: 2; } }

.contents_area {
  overflow: hidden;
  position: relative;
  padding: clamp(80px, 10vw, 120px) 0 clamp(100px, 13.334vw, 160px);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../images/top/bg_contents.jpg"); }
  @media screen and (max-width: 480px) {
    .contents_area {
      padding: 50px 0; } }
  .contents_area .bg_group {
    position: absolute;
    inset: 0; }
    @media screen and (max-width: 1024px) {
      .contents_area .bg_group {
        display: none; } }
    .contents_area .bg_group .bg {
      position: absolute;
      inset: 0; }
      .contents_area .bg_group .bg:before {
        content: "";
        position: absolute;
        inset: 0;
        background-position: top center;
        background-repeat: no-repeat;
        background-size: cover;
        opacity: 0;
        transform: scale(1.1);
        transition: 0.6s opacity ease-in-out 0s,0s transform ease-in-out 0.6s; }
      .contents_area .bg_group .bg.mouse_on:before {
        transform: scale(1);
        opacity: 1;
        transition: 0.6s opacity ease-in-out 0s,2s transform ease-in-out 0s; }
      .contents_area .bg_group .bg.mouse_on .cap {
        opacity: 1; }
      .contents_area .bg_group .bg.bg_access:before {
        background-image: url("../images/top/bg_access.jpg"); }
      .contents_area .bg_group .bg.bg_plan:before {
        background-image: url("../images/top/bg_plan.jpg"); }
      .contents_area .bg_group .bg.bg_brand:before {
        background-image: url("../images/top/bg_brand.jpg"); }
      .contents_area .bg_group .bg .cap {
        opacity: 0;
        transition: 0.6s opacity ease-in-out 0s; }
  .contents_area .contents_in {
    position: relative; }
    .contents_area .contents_in .contents_ttl {
      font-size: clamp(20px, 2.5vw, 30px);
      text-align: center;
      margin-bottom: clamp(40px, 5vw, 60px); }
      @media screen and (max-width: 480px) {
        .contents_area .contents_in .contents_ttl {
          font-size: 30px;
          margin-bottom: 30px; } }
    .contents_area .contents_in .underlayer {
      max-width: 1060px;
      margin: 0 auto;
      flex-wrap: wrap;
      justify-content: flex-start;
      gap: 20px 1.88%; }
      @media screen and (max-width: 1024px) {
        .contents_area .contents_in .underlayer {
          gap: 20px 2%; } }
      @media screen and (max-width: 820px) {
        .contents_area .contents_in .underlayer {
          gap: 20px 4%; } }
      @media screen and (max-width: 480px) {
        .contents_area .contents_in .underlayer {
          gap: 20px 0; } }
      .contents_area .contents_in .underlayer .under_box {
        width: 23.59%;
        will-change: transform; }
        @media screen and (max-width: 1024px) {
          .contents_area .contents_in .underlayer .under_box {
            width: 32%; } }
        @media screen and (max-width: 820px) {
          .contents_area .contents_in .underlayer .under_box {
            width: 48%; } }
        @media screen and (max-width: 480px) {
          .contents_area .contents_in .underlayer .under_box {
            width: 100%; } }
        @media screen and (max-width: 1024px) {
          .contents_area .contents_in .underlayer .under_box.link_none {
            display: none; } }
        .contents_area .contents_in .underlayer .under_box.link_none .under_link {
          opacity: 0.3;
          pointer-events: none; }
        .contents_area .contents_in .underlayer .under_box .under_link {
          width: 100%;
          aspect-ratio: 1;
          padding: clamp(20px, 2.5vw, 30px);
          padding-bottom: 20px;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          background: #3caec8;
          border: 1px solid #3caec8;
          border-radius: 5px;
          color: #FFF;
          transition: 0.3s all ease-in-out 0s; }
          @media screen and (max-width: 1024px) {
            .contents_area .contents_in .underlayer .under_box .under_link {
              background-color: transparent;
              aspect-ratio: 2 / 1.35; } }
          @media screen and (max-width: 820px) {
            .contents_area .contents_in .underlayer .under_box .under_link {
              padding: 30px; } }
          @media screen and (max-width: 480px) {
            .contents_area .contents_in .underlayer .under_box .under_link {
              padding: 20px;
              aspect-ratio: 37.4 / 20; } }
          body:not(.mobile) .contents_area .contents_in .underlayer .under_box .under_link:hover .move_txt:after {
            width: 105%; }
          .contents_area .contents_in .underlayer .under_box .under_link.other_link {
            border-color: #FFF;
            background: rgba(60, 174, 200, 0); }
          .contents_area .contents_in .underlayer .under_box .under_link .sp_bg {
            display: none; }
            @media screen and (max-width: 1024px) {
              .contents_area .contents_in .underlayer .under_box .under_link .sp_bg {
                display: block;
                position: absolute;
                inset: 0;
                background-position: top center;
                background-repeat: no-repeat;
                background-size: cover;
                border-radius: 5px; } }
            .contents_area .contents_in .underlayer .under_box .under_link .sp_bg.under_acc {
              background-image: url("../images/top/bg_access_sp.jpg"); }
            .contents_area .contents_in .underlayer .under_box .under_link .sp_bg.under_pla {
              background-image: url("../images/top/bg_plan_sp.jpg"); }
            .contents_area .contents_in .underlayer .under_box .under_link .sp_bg.under_bra {
              background-image: url("../images/top/bg_brand_sp.jpg"); }
          .contents_area .contents_in .underlayer .under_box .under_link .page_name {
            position: relative;
            flex-direction: column;
            row-gap: clamp(10px, 1.667vw, 20px); }
            @media screen and (max-width: 480px) {
              .contents_area .contents_in .underlayer .under_box .under_link .page_name {
                row-gap: 10px; } }
            .contents_area .contents_in .underlayer .under_box .under_link .page_name .cinzel {
              font-size: clamp(18px, 2.167vw, 26px);
              line-height: 1; }
              @media screen and (max-width: 820px) {
                .contents_area .contents_in .underlayer .under_box .under_link .page_name .cinzel {
                  font-size: 4vw; } }
              @media screen and (max-width: 480px) {
                .contents_area .contents_in .underlayer .under_box .under_link .page_name .cinzel {
                  font-size: 26px; } }
            .contents_area .contents_in .underlayer .under_box .under_link .page_name .jp {
              font-size: clamp(11px, 1.167vw, 14px);
              line-height: 1.7; }
              @media screen and (max-width: 820px) {
                .contents_area .contents_in .underlayer .under_box .under_link .page_name .jp {
                  font-size: 2vw; } }
              @media screen and (max-width: 480px) {
                .contents_area .contents_in .underlayer .under_box .under_link .page_name .jp {
                  font-size: 3.4vw; } }
          .contents_area .contents_in .underlayer .under_box .under_link .move_txt {
            width: 100%;
            font-size: clamp(11px, 1.167vw, 14px);
            position: relative;
            padding-bottom: 3px; }
            .contents_area .contents_in .underlayer .under_box .under_link .move_txt.coming {
              font-size: clamp(11px, 1vw, 12px); }
              .contents_area .contents_in .underlayer .under_box .under_link .move_txt.coming::after {
                content: none; }
            .contents_area .contents_in .underlayer .under_box .under_link .move_txt::after {
              content: "";
              margin: 0;
              padding: 0;
              border: none;
              border-bottom: solid 1px currentColor;
              border-right: solid 1px currentColor;
              position: absolute;
              bottom: 0%;
              left: -4px;
              height: 10px;
              width: 100%;
              transform: skewX(45deg);
              transition: 0.3s all ease-in-out 0s; }
              @media screen and (max-width: 480px) {
                .contents_area .contents_in .underlayer .under_box .under_link .move_txt::after {
                  width: 60%; } }