#mv-container {
  margin: auto;
  padding: 80px 0 0;
  position: relative;
  overflow: hidden; }
  @media (min-width: 1024px) {
    #mv-container {
      padding: 100px 0 0; } }
  #mv-container .slide-wrapper {
    position: relative;
    width: 100%;
    max-width: 1800px;
    margin: auto; }
    #mv-container .slide-wrapper .main-visual {
      padding: 0 5%; }
      @media (min-width: 768px) {
        #mv-container .slide-wrapper .main-visual {
          display: flex;
          padding: 0 4% 0 3%; } }
      #mv-container .slide-wrapper .main-visual .slide-left {
        width: 100%;
        margin-top: 14px; }
        @media (min-width: 768px) {
          #mv-container .slide-wrapper .main-visual .slide-left {
            padding-right: 1em;
            width: 50%;
            margin-top: 0; } }
        @media (min-width: 1024px) {
          #mv-container .slide-wrapper .main-visual .slide-left {
            padding-right: 2em; } }
        #mv-container .slide-wrapper .main-visual .slide-left .content-container {
          position: relative;
          width: 100%;
          height: 100%; }
          #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide {
            position: absolute;
            width: 100%;
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.5s ease, transform 0.5s ease;
            visibility: hidden;
            display: flex;
            align-items: center;
            height: 100%; }
            #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide.active {
              opacity: 1;
              transform: translateY(0);
              visibility: visible;
              position: relative; }
            #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide h2 {
              margin-bottom: 10px; }
              #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide h2 a {
                font-size: 6.9vw;
                font-weight: bold;
                line-height: 1.25em;
                color: #fff; }
                @media (min-width: 768px) {
                  #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide h2 a {
                    font-size: 4vw; } }
                @media (min-width: 1800px) {
                  #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide h2 a {
                    font-size: 3em; } }
                #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide h2 a:hover {
                  color: #F1FF4E; }
            #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide .data {
              margin-top: 10px;
              display: flex;
              align-items: center; }
              @media (min-width: 768px) {
                #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide .data {
                  margin-top: 20px; } }
              #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide .data ul li {
                font-size: 0.8em;
                font-weight: bold;
                color: #000;
                display: inline-block;
                text-align: center;
                border-radius: 50px;
                padding: 4px 12px;
                background-color: #F1FF4E;
                margin-right: 10px; }
                @media (min-width: 768px) {
                  #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide .data ul li {
                    font-size: 0.9em; } }
              #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide .data h4 {
                font-family: bebas-kai, sans-serif;
                font-weight: 400;
                font-style: normal;
                font-size: 1.125em;
                color: #fff; }
                @media (min-width: 768px) {
                  #mv-container .slide-wrapper .main-visual .slide-left .content-container .content-slide .data h4 {
                    font-size: 1.25em; } }
    #mv-container .slide-wrapper .slide-center {
      width: 100%;
      text-align: center;
      position: relative; }
      @media (min-width: 768px) {
        #mv-container .slide-wrapper .slide-center {
          width: 70%; } }
      #mv-container .slide-wrapper .slide-center a {
        position: relative; }
        #mv-container .slide-wrapper .slide-center a:hover .main-ph > .current-slide-image {
          transform: scale(1.04); }
        #mv-container .slide-wrapper .slide-center a .main-ph {
          position: relative;
          border-radius: 10px;
          overflow: hidden;
          display: block;
          z-index: 1;
          width: 85%; }
          @media (min-width: 768px) {
            #mv-container .slide-wrapper .slide-center a .main-ph {
              border-radius: 20px;
              width: 60%; } }
          #mv-container .slide-wrapper .slide-center a .main-ph img.current-slide-image {
            object-fit: cover;
            display: none;
            transition: .5s;
            border-radius: 10px;
            transform: scale(1); }
            @media (min-width: 768px) {
              #mv-container .slide-wrapper .slide-center a .main-ph img.current-slide-image {
                border-radius: 20px; } }
            #mv-container .slide-wrapper .slide-center a .main-ph img.current-slide-image.active {
              display: block; }
      #mv-container .slide-wrapper .slide-center .next-slide-container {
        position: absolute;
        right: 0;
        top: 75%;
        width: 30%;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        z-index: 10;
        transform: translateY(-50%); }
        @media (min-width: 768px) {
          #mv-container .slide-wrapper .slide-center .next-slide-container {
            top: 55%; } }
        #mv-container .slide-wrapper .slide-center .next-slide-container .next-size-text {
          position: relative;
          top: -10px;
          left: 0;
          z-index: 10;
          height: 30px;
          margin: auto; }
          @media (min-width: 768px) {
            #mv-container .slide-wrapper .slide-center .next-slide-container .next-size-text {
              position: absolute;
              top: 0;
              bottom: 0;
              left: -20%; } }
          #mv-container .slide-wrapper .slide-center .next-slide-container .next-size-text h3 {
            font-family: bebas-kai, sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 1.5em;
            text-align: right;
            color: #F1FF4E;
            border-bottom: 1px solid #F1FF4E;
            width: 100px; }
            @media (min-width: 768px) {
              #mv-container .slide-wrapper .slide-center .next-slide-container .next-size-text h3 {
                font-size: 2em;
                text-align: left;
                width: 80px; } }
        #mv-container .slide-wrapper .slide-center .next-slide-container .next-ph {
          background-color: #222324;
          transform: rotate(5deg);
          transition: .5s;
          border-radius: 5px; }
          @media (min-width: 768px) {
            #mv-container .slide-wrapper .slide-center .next-slide-container .next-ph {
              border-radius: 10px; }
              #mv-container .slide-wrapper .slide-center .next-slide-container .next-ph:hover {
                transform: rotate(0deg); }
                #mv-container .slide-wrapper .slide-center .next-slide-container .next-ph:hover .next-slide-image {
                  opacity: 1; } }
          #mv-container .slide-wrapper .slide-center .next-slide-container .next-ph .next-slide-image {
            width: 100%;
            height: auto;
            object-fit: cover;
            opacity: 0.7;
            cursor: pointer;
            border-radius: 5px; }
            @media (min-width: 768px) {
              #mv-container .slide-wrapper .slide-center .next-slide-container .next-ph .next-slide-image {
                border-radius: 10px; } }
    #mv-container .slide-wrapper .nav-container {
      display: flex;
      align-items: center;
      justify-content: end;
      margin-top: -20px; }
      @media (min-width: 768px) {
        #mv-container .slide-wrapper .nav-container {
          position: absolute;
          bottom: 0;
          margin-top: 20px; } }
      @media (min-width: 1024px) {
        #mv-container .slide-wrapper .nav-container {
          bottom: 8%; } }
      #mv-container .slide-wrapper .nav-container .pagination {
        font-size: 1em;
        font-weight: bold;
        margin-right: 1em;
        color: #F1FF4E;
        letter-spacing: 0.05em; }
        #mv-container .slide-wrapper .nav-container .pagination .current-page {
          font-size: 1.8em;
          font-weight: bold; }
        #mv-container .slide-wrapper .nav-container .pagination .total-pages {
          font-size: 1.2em;
          font-weight: bold; }
      #mv-container .slide-wrapper .nav-container .next-button {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 60px;
        height: 40px;
        border-radius: 50%;
        cursor: pointer;
        transition: all 0.3s ease;
        border: 1px solid #F1FF4E; }
        @media (min-width: 1024px) {
          #mv-container .slide-wrapper .nav-container .next-button {
            width: 80px;
            height: 50px; } }
        #mv-container .slide-wrapper .nav-container .next-button:hover {
          background-color: rgba(0, 0, 0, 0.1); }
        #mv-container .slide-wrapper .nav-container .next-button span {
          font-family: bebas-kai, sans-serif;
          font-weight: 400;
          font-style: normal;
          font-size: 1.4em;
          color: #F1FF4E; }
          @media (min-width: 768px) {
            #mv-container .slide-wrapper .nav-container .next-button span {
              font-size: 1.8em; } }
  #mv-container .back-txt {
    position: absolute;
    height: 100%;
    display: flex;
    margin-top: 25%; }
    @media (min-width: 768px) {
      #mv-container .back-txt {
        align-items: center;
        margin-top: auto; } }
    #mv-container .back-txt .YokoScroll {
      display: flex;
      overflow: hidden; }
      #mv-container .back-txt .YokoScroll .slideshow {
        display: flex; }
        #mv-container .back-txt .YokoScroll .slideshow figure {
          width: 2000px; }
          @media (min-width: 768px) {
            #mv-container .back-txt .YokoScroll .slideshow figure {
              width: 2000px; } }
          @media (min-width: 1024px) {
            #mv-container .back-txt .YokoScroll .slideshow figure {
              width: 3000px; } }
          @media (min-width: 1450px) {
            #mv-container .back-txt .YokoScroll .slideshow figure {
              width: 4000px; } }
        #mv-container .back-txt .YokoScroll .slideshow.show1 {
          animation: loop-slide 300s infinite linear 1s both; }
@keyframes loop-slide {
  from {
    transform: translateX(0); }
  to {
    transform: translateX(-100%); } }
.nav-dots {
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  z-index: 10;
  display: none; }
  .nav-dots .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s ease; }
  .nav-dots .dot.active {
    background-color: #333; }