/* 画像を横幅いっぱいにするためのコンテナ */

.full-width-image {
    width: 100%;
    height: auto;
    overflow: hidden;
}


/* 画像自体のスタイル */

.full-width-image img {
    width: 100%;
    height: auto;
    display: block;
}

.full-width-image .sp-image {
    display: none;
}

.top-image-section {
    position: relative;
    margin-bottom: 60px;
}

.top-image-so {
    position: absolute;
    bottom: 100px;
    right: 200px;
    width: 530px;
    /* 必要に応じて調整 */
    height: auto;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
}


/* メディアクエリでレスポンシブ対応 */

@media (max-width: 1700px) {
    .top-image-so {
        bottom: 80px;
        right: 200px;
        width: 530px;
    }
}

@media (max-width: 1550px) {
    .top-image-so {
        bottom: 60px;
        right: 200px;
        width: 450px;
    }
}

@media (max-width: 1250px) {
    .top-image-so {
        bottom: 40px;
        right: 200px;
        width: 400px;
    }
    .top-image-section {
        margin-bottom: 60px;
    }
}

@media (max-width: 1150px) {
    .top-image-so {
        bottom: 20px;
        right: 100px;
        width: 350px;
    }
    .top-image-section {
        margin-bottom: 60px;
    }
}

@media (max-width: 950px) {
    .top-image-so {
        bottom: 0px;
        right: 50px;
        width: 350px;
    }
    .top-image-section {
        margin-bottom: 60px;
    }
}

@media (max-width: 768px) {
    .full-width-image {
        height: auto;
        /* 高さを自動にすることで縦長の画面に対応 */
    }
    .full-width-image .pc-image {
        display: none;
    }
    .full-width-image .sp-image {
        display: block;
    }
    .top-image-so {
        bottom: -220px;
        right: 0px;
        width: 440px;
    }
    .top-image-section {
        margin-bottom: 260px;
    }
}

@media (max-width: 550px) {
    .top-image-so {
        bottom: -190px;
        right: 0px;
        width: 400px;
    }
    .top-image-section {
        margin-bottom: 250px;
    }
}

@media (max-width: 450px) {
    .top-image-so {
        bottom: -160px;
        right: 0px;
        width: 300px;
    }
    .top-image-section {
        margin-bottom: 220px;
    }
}