.gallery {
    padding: 3rem 0;
        max-width: 934px;
    width: 80%;
    margin: 0 auto;
}
.gallery h2 {
    margin: 2rem 0;
    font-size: 30px;
    font-weight: bolder;
}
/* ビフォーアフター */
.gallery .before_after h3{
    font-size: 30px;
    font-weight: bolder;
    }
.gallery .before_after{
    align-items: flex-start;
}
.gallery .before_after img {
    display: block;
    width: 100%;
}
.gallery .before_after .svg_ba{
    width: 10%;
}
.before_after div:last-of-type{
    margin: 5rem 0 10rem;
}



/* スライダー */
.gallery-slider .child{
    margin: 1rem;
}

/* slick-prevを丸くして中央に左矢印を表示 */
.slick-prev {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #ccc;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -50px; /* 必要に応じて調整 */
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.slick-prev:before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    border-top: 3px solid #888;
    border-left: 3px solid #888;
    transform: rotate(-45deg);
    margin-left: 4px;
}
/* slick-nextを丸くして中央に右矢印を表示 */
.slick-next {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #ccc;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: -50px; /* 必要に応じて調整 */
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.slick-next:before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    border-top: 3px solid #888;
    border-right: 3px solid #888;
    transform: rotate(45deg);
    margin-right: 4px;
}

/* SP */
@media (width < 900px) {
.slick-prev{
    left: -20px;
}
.slick-next{
    right: -20px;
}
.gallery {
    padding: 0 0 3rem;
}
/* ビフォーアフター */
.gallery .before_after h3 {
    font-size: 20px;
}
.gallery .before_after .svg_ba {
    margin-top: 3rem;
}
.before_after div:last-of-type{
    margin: 5rem 0
}


}