#mvContainer { position: relative; width: 100%; }
#mvContainer .pc-size { display: block; }
#mvContainer .sp-size { display: none; }
@keyframes cartenMotion { 0% { opacity: 1; }
  100% { opacity: 0; } }
#mvContainer #mvCarten { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; opacity: 1; }
#mvContainer #mvCarten.fadeOut { pointer-events: none; animation: 1s ease 0s cartenMotion forwards; }
@media screen and (max-width: 600px) { #mvContainer .pc-size { display: none; }
  #mvContainer .sp-size { display: block; } }
#mvContainer .mvBorder { width: 10px; height: 100%; position: absolute; top: 0; left: 0; background-image: url("../images/top/main/mainvisual_border.png"); background-position: top center; background-size: cover; }

#mvSlider { width: 100%; overflow: hidden; margin-bottom: 0; background-color: #fff; }
#mvSlider .cell-cls .cell-inner { width: 100%; overflow: hidden; aspect-ratio: 1440 / 928; position: relative; }
#mvSlider .cell-cls .mv-visual { position: absolute; top: 0; left: 0; }
#mvSlider .cell-cls .mv-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
#mvSlider .cell-cls .mv-visual .mv-visual-inner { position: relative; width: 100%; }
#mvSlider .cell-cls .mv-visual .prot { position: absolute; top: 0; left: 0; width: 100%; }
#mvSlider .cell-cls .mv-copy1, #mvSlider .cell-cls .mv-copy2 { position: absolute; }
#mvSlider .cell-cls .mv-copy1 img, #mvSlider .cell-cls .mv-copy2 img { width: 100%; height: auto; }
@keyframes cell0VisualMotion { 0% { transform: scale(2, 2); }
  100% { transform: scale(1, 1); } }
@keyframes cell0ProtMotion { 0% { opacity: 0; transform: translateY(2%); }
  60% { opacity: 0; transform: translateY(2%); }
  100% { opacity: 1; transform: translateY(0%); } }
@keyframes cell1VisualMotion { 0% { object-position: 100% 100%; }
  100% { object-position: 0% 100%; } }
@keyframes cell2VisualMotion { 0% { object-position: 50% 0%; }
  100% { object-position: 50% 100%; } }
#mvSlider .cell-cls .cap { font-family: "Helvetica Neue", "Helvetica","Yu Gothic",  'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif; font-weight: normal; font-size: 11px; position: absolute; display: inline-block; bottom: 10%; right: 5px; color: #fff; text-shadow: #222 0 0 2px, #222 0 0 3px, #222 0 0 4px, #222 0 0 5px; text-align: right; line-height: 1.2; }
#mvSlider .cell-cls.cell-0 .mv-visual { transform-origin: 50% 20%; transform: scale(2, 2); }
#mvSlider .cell-cls.cell-0 .mv-visual .prot { opacity: 0; }
#mvSlider .cell-cls.cell-0 .mv-copy1 { top: 2.5%; left: 2.5%; width: 22.7777777778%; }
#mvSlider .cell-cls.cell-0 .mv-copy2 { top: 4.5%; right: 2.5%; width: 38.4722222222%; }
#mvSlider .cell-cls.cell-1 .mv-visual { width: 100%; height: 100%; }
#mvSlider .cell-cls.cell-1 .mv-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center left; }
#mvSlider .cell-cls.cell-1 .mv-copy1 { top: 5%; left: 5%; width: 26.5277777778%; filter: drop-shadow(0 0 10px #000); }
#mvSlider .cell-cls.cell-1 .mv-copy2 { top: 4.5%; right: 2.5%; width: 6.8055555556%; filter: drop-shadow(0 0 10px #000) drop-shadow(0 0 10px #000); }
#mvSlider .cell-cls.cell-1 .mv-visual { width: 100%; height: 100%; }
#mvSlider .cell-cls.cell-1 .mv-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center left; }
#mvSlider .cell-cls.cell-1 .mv-copy1 { top: 5%; left: 4%; width: 26.5277777778%; filter: drop-shadow(0 0 10px #000); }
#mvSlider .cell-cls.cell-1 .mv-copy2 { top: 4.5%; right: 2.5%; width: 6.8055555556%; filter: drop-shadow(0 0 10px #000) drop-shadow(0 0 10px #000); }
#mvSlider .cell-cls.cell-2 .mv-visual { width: 100%; height: 100%; }
#mvSlider .cell-cls.cell-2 .mv-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
#mvSlider .cell-cls.cell-2 .mv-copy1 { top: 5%; left: 4%; width: 19.4444444444%; filter: drop-shadow(0 0 10px #000); }
#mvSlider .cell-cls.cell-2 .mv-copy2 { top: 4.5%; right: 2.5%; width: 34.3055555556%; filter: drop-shadow(0 0 10px #000) drop-shadow(0 0 10px #000); }
#mvSlider .cell-cls.motion.cell-0 .mv-visual { animation: cell0VisualMotion 5s cubic-bezier(0.42, 0, 0.41, 1) 0s forwards; }
#mvSlider .cell-cls.motion.cell-0 .mv-visual .prot { animation: cell0ProtMotion 4s cubic-bezier(0.42, 0, 0.41, 1) 0s forwards; }
#mvSlider .cell-cls.motion.cell-1 .mv-visual img { animation: cell1VisualMotion 20s linear 0s forwards; }
#mvSlider .cell-cls.motion.cell-2 .mv-visual img { animation: cell2VisualMotion 20s linear 0s forwards; }
@media screen and (max-width: 600px) { @keyframes cell1VisualMotion { 0% { object-position: 100% 100%; }
    100% { object-position: 50% 100%; } }
  #mvSlider .cell-cls .cell-inner { aspect-ratio: 1020 / 928; }
  #mvSlider .cell-cls.cell-0 .mv-visual { transform-origin: 50% 20%; transform: scale(2, 2); }
  #mvSlider .cell-cls.cell-0 .mv-visual img { width: 142%; margin-left: -21%; }
  #mvSlider .cell-cls.cell-0 .mv-visual .prot { opacity: 0; }
  #mvSlider .cell-cls.cell-0 .mv-copy2 { top: 4.5%; right: 2.5%; width: 57.7083333333%; }
  #mvSlider .cell-cls.cell-1 .mv-visual img { width: 100%; height: 100%; object-position: center left; }
  #mvSlider .cell-cls.cell-1 .mv-copy1 { width: 39.7916666667%; }
  #mvSlider .cell-cls.cell-1 .mv-copy2 { width: 10.2083333333%; }
  #mvSlider .cell-cls.cell-2 .mv-visual img { width: 150%; margin-left: -25%; }
  #mvSlider .cell-cls.cell-2 .mv-copy1 { width: 29.1666666667%; }
  #mvSlider .cell-cls.cell-2 .mv-copy2 { width: 51.4583333333%; } }
#mvSlider .slick-dots { width: auto; display: flex; justify-content: flex-start; align-items: center; position: absolute; flex-direction: row; top: auto; right: auto; left: 50%; bottom: 8%; transform: translateX(-50%); }
#mvSlider .slick-dots li { width: auto; height: auto; }
#mvSlider .slick-dots li button { width: auto; height: auto; }
#mvSlider .slick-dots li button::before { display: none; }
#mvSlider .slick-dots li button::after { content: ""; display: block; width: 10px; height: 10px; background-color: #fff; border-radius: 50%; box-shadow: 0 0 10px #000; }
#mvSlider .slick-dots li.slick-active button::after { background-color: #49a069; }
@media screen and (max-width: 600px) { #mvSlider .slick-dots { flex-direction: row; top: auto; right: auto; left: 50%; bottom: 6%; transform: translateX(-50%); } }