.container a { text-decoration: none; }
.container *, .container *:before, .container *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }

.flex, .flex2, .flex3, .flex4 { display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: stretch; align-items: stretch; }
.flex *, .flex2 *, .flex3 *, .flex4 * { min-height: 0%; }

.mv-container { width: 100%; }
.mv-container .mv-inner { position: relative; width: 100%; overflow: hidden; }
.mv-container .mv-note { position: absolute; bottom: 10px; right: 10px; color: #fff; font-weight: bold; text-shadow: 0 0 5px black, 0 0 10px black; }

.mv-img { width: 100%; height: 100%; margin-bottom: 0 !important; transition: opacity 0.5s ease 0s; }
.mv-img.fadeIn { opacity: 1; transition-duration: 1s; }
.mv-img img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }

.mv-video { position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; transition: opacity 0.5s ease 0s; }
.mv-video.fadeOut { opacity: 0; pointer-events: none; }
.mv-video video { margin-left: -1px; width: calc(100% + 2px); height: 100%; object-fit: cover; object-position: center center; }

.mv-btn-cls { position: absolute; top: 12px; right: 10px; width: 90px; padding: 10px 0; text-align: center; font-size: 1.1rem; background-color: #fff; color: #333; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); pointer-events: none; opacity: 0; transition: 0.3s ease 0s opacity; font-family: trajan-pro-3, serif; font-weight: 400; font-style: normal; }
.mv-btn-cls.active { opacity: 1; pointer-events: auto; cursor: pointer; }
@media screen and (max-width: 768px) { .mv-btn-cls { top: 10px; } }

.mv-loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: opacity 0.3s ease 0s; background-color: #fff; display: flex; justify-content: center; align-items: center; }
.mv-loading.fadeOut { opacity: 0; pointer-events: none; }
.mv-loading ul { display: flex; justify-content: center; align-items: center; }
.mv-loading li { margin: 0 2px; width: 2px; height: 16px; animation: loadingMotion 0.6s linear 0s infinite; }
@keyframes loadingMotion { 0% { background-color: rgba(12, 56, 90, 0.2); }
  20% { background-color: #0c385a; }
  50% { background-color: rgba(12, 56, 90, 0.2); }
  100% { background-color: rgba(12, 56, 90, 0.2); } }
.mv-loading li:nth-child(1) { animation-delay: 0s; }
.mv-loading li:nth-child(2) { animation-delay: 0.1s; }
.mv-loading li:nth-child(3) { animation-delay: 0.2s; }
.mv-loading li:nth-child(4) { animation-delay: 0.3s; }
.mv-loading li:nth-child(5) { animation-delay: 0.4s; }
.mv-loading li:nth-child(6) { animation-delay: 0.5s; }