/* -------------------- メインビジュアルスライド -------------------- */

/* スライダー／Swiper 部分の幅調整 */
.swiper-container {
    width: 100% !important;
    /* 親幅いっぱいに */
    max-width: 100%;
    height: auto;
    /* 必要なら高さ指定も調整可 */
}

/* スライド画像 */
.swiper-slide img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* ドットの位置を画像内に配置 */
.metaslider .flex-control-nav {
    position: absolute;
    bottom: 10px;
    /* 画像下部からの距離 */
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

/* ドットのスタイル調整 */
.metaslider .flex-control-nav li {
    display: inline-block;
    margin: 0 5px;
}

.metaslider .flex-control-nav li a {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.7);
    display: block;
    transition: background-color 0.3s;
}

.metaslider .flex-control-nav li a:hover,
.metaslider .flex-control-nav li a.flex-active {
    background-color: rgba(255, 255, 255, 1);
}