@import url('../root.css');

/* SP用スタイル */
@media screen and (max-width: 1024px) {
    main {
        .service-area {
            margin-top: 50px;

            .service-text-area {
                width: 90%;
                margin: 0 auto;
                color: #666666;
                line-height: 2;
                font-size: var(--font-medium);
                font-weight: 500;

                .service-text {
                    p {
                        text-align: left;
                        font-size: var(--font-small);
                    }
                }
            }
        }

        .service-detail {
            width: 90%;
            margin: 0 auto;
            margin-top: 60px;
            display: block;

            .service-detail-area {
                width: 100%;
                margin: 0 auto;
                margin-top: 120px;

                .service-detail-img {
                    width: 100%;
                    margin: 0 auto;

                    img {
                        width: 100%;
                        margin: 0 auto;
                        display: block;
                        object-fit: cover;
                        height: 35vh;
                    }
                }

                .service-detail-title-area {
                    text-align: center;
                    margin-top: 20px;
                    font-weight: bold;

                    .service-detail-title {
                        font-size: var(--font-xs);
                        text-align: center;

                        h2 {
                            margin-top: 10px;
                        }

                        .solo-title {
                            margin-top: 30px;
                        }
                    }

                    .service-detail-sub-title {
                        font-size: var(--font-small);
                        margin-top: 10px;
                        text-align: center;

                        p {
                            margin: 0;
                        }
                    }
                }

                .service-detail-text-area {
                    margin-top: 20px;
                    text-align: center;

                    .service-detail-text {
                        width: 90%;
                        margin: 0 auto;
                        font-size: var(--font-small);
                        line-height: 2.5;
                        color: #666666;
                        font-weight: 500;
                    }
                }
            }
        }
    }
}