.l-bg__wrap {
    .mv {

        h2 {
            img {
                width: 23.5vw;
            }
        }

         > img {
            top: var(--p190-spa);
            right: var(--p100-spa);
            width: 48.5vw;
        }
    }
}

.l-main {

    h3 {
        font-size: var(--24to42);
        font-weight: var(--fw-700);
        letter-spacing: var(--lsp-80);
        padding-bottom: var(--p30-spa);
        margin-bottom: var(--p100-spa);
        position: relative;
        text-align: center;

        &::after {
            content: "";
            display: block;
            width: var(--p60-spa);
            height: 6px;
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
        }
    }

    .wrapper {
                background-color: #fff;
                padding: var(--p140-spa) var(--p160-spa) var(--p160-spa);
                border-radius: var(--p40-spa);
            }

    .bl-bg__common2 {
        .container {
            padding-bottom: var(--p250-spa);

            h3 {
                &::after {
                    background-color: var(--yellow);
                }
            }

            .wrapper {
                position: relative;
                z-index: 10;

                &::before,&::after {
                    content: "";
                    display: block;
                    position: absolute;
                    background-size: contain;
                    background-repeat: no-repeat;
                }

                &::before {
                    width: 11.2vw;
                    height: 11.2vw;
                    background-image: url(../images/company/summary-deco1.png);
                    right: -3.9vw;
                    top: 20.8vw;
                }

                &::after {
                    width: 23.4vw;
                    height: 20.3vw;
                    background-image: url(../images/company/summary-deco2.png);
                    left: -6.8vw;
                    bottom: -15.2vw;
                    z-index: 10;
                }

                dl {
                    display: flex;
                    align-items: flex-start;
                    justify-content: flex-start;
                    border-bottom: 1px solid var(--gray);
                    padding-bottom: var(--p60-spa);
                    padding-top: var(--p60-spa);

                    dt {
                        width: 24.5%;
                        color: var(--blue);
                        font-size: var(--14to20);
                        font-weight: var(--fw-900);
                        letter-spacing: var(--lsp-60);
                    }

                    dd {
                        width: 75.5%;
                        font-size: var(--14to18);
                        line-height: var(--lh-22);
                        margin-top: -0.5vw;

                        a {
                            text-decoration: underline;
                            transition: 0.3s;
                            display: inline-block;

                            &:hover {
                                opacity: 0.7;
                                transition: 0.3s;
                            }
                        }
                    }
                }

                .medal {
                    padding-top: 0;

                    dd {

                        p {
                            margin-bottom: var(--p35-spa);
                        }

                        div {
                            width: 16.6vw;
                            text-align: center;

                            img {
                                width: 100%;
                                margin-bottom: var(--p20-spa);
                            }
                        }
                    }
                }

                .tel {
                    dd {
                        display: flex;
                        align-items: center;
                        justify-content: flex-start;
                    }
                }
            }
        }
    }

    .grd-bg {
        background: linear-gradient(to bottom, #FFFAB4 0%, #FFEB41 100%);
        position: relative;

        &::before,&::after {
            content: "";
            display: block;
            width: 44vw;
            height: 47.9vw;
            background-size: contain;
            background-repeat: no-repeat;
            position: absolute;
            z-index: 0;
        }

        &::before {
            background-image: url(../images/common/bg-left_deco_pc.png);
            top: var(--p180-spa);
            left: 0;
        }

        &::after {
            background-image: url(../images/common/bg-right_deco_pc.png);
            top: 40.6vw;
            right: 0;
        }

        .history {
        padding-top: var(--p180-spa);
        position: relative;
        z-index: 10;

        &::before {
            content: "";
            display: block;
            position: absolute;
            background-size: contain;
            background-repeat: no-repeat;
            background-image: url(../images/company/history-deco3.png);
            width: 15.2vw;
            height: 15.4vw;
            bottom: -4vw;
            right: 9vw;
            z-index: 10;
        }

                h3 {
                &::after {
                    background-color: var(--blue);
                }
            }

            .wrapper {
                position: relative;

                &::before,&::after {
                    content: "";
                    display: block;
                    position: absolute;
                    background-size: contain;
                    background-repeat: no-repeat;
                }

                &::before {
                    width: 13.4vw;
                    height: 17.1vw;
                    background-image: url(../images/company/history-deco1.png);
                    right: -3.7vw;
                    top: -9vw;
                }

                &::after {
                    width: 10.9vw;
                    height: 17.5vw;
                    background-image: url(../images/company/history-deco2.png);
                    left: -8.8vw;
                    bottom: 54.6vw;
                }

                .block {
                    position: relative;

                    &::after {
                        content: "";
                        display: block;
                        width: 12px;
                        height: 100%;
                        border-radius: 10px;
                        background-color: var(--l-blue);
                        position: absolute;
                        top: 0;
                        left: 10.57vw;
                        z-index: 1;
                        transform: translateY(1vw);
                    }

                    ul {
                        position: relative;
                        z-index: 10;

                        li {
                            display: flex;
                            align-items: center;
                            justify-content: flex-start;
                            margin-bottom: var(--p60-spa);

                            .year {
                                font-family: var(--ff-jost);
                                font-size: var(--22to38);
                                letter-spacing: 0;
                                font-weight: var(--fw-600);
                                color: var(--blue);
                                width: 10.57vw;
                            }

                            .dots {
                                display: block;
                                width: 12px;
                                height: 12px;
                                border-radius: 50%;
                                background: var(--blue);
                                margin-right: 2.86vw;
                            }

                            .desc {
                                font-size: var(--14to18);
                                line-height: var(--lh-22);
                                width: 70%;
                            }
                        }

                        .long {
                            align-items: flex-start;

                            .dots {
                                margin-top: 0.7vw;
                            }
                        }
                    }
                }
                
            }
    }

    }
    

}

@media screen and (max-width:1100px) {

}

@media screen and (max-width:768px) {

.l-bg__wrap {
    .mv {

        h2 {

            img {
                width: 59.5vw;
            }
        }

         > img {
            top: 57.3vw;
            right: var(--p25-spa);
            width: 77.3vw;
        }
    }
}

.l-main {

    h3 {
        padding-bottom: var(--p20-spa);
        margin-bottom: var(--p50-spa);

        &::after {
            height: 3px;
        }
    }

    .wrapper {
                padding: var(--p60-spa) var(--p25-spa) var(--p80-spa);
                border-radius: var(--p25-spa);
            }

    .bl-bg__common2 {

        .container {

            padding-bottom: var(--p120-spa);
            padding-left: var(--p25-spa);
            padding-right: var(--p25-spa);

            .wrapper {

                position: relative;

                &::before {
                    width: 22.7vw;
                    height: 22.7vw;
                    right: 11.1vw;
                    top: -11.2vw;
                }

                &::after {
                    width: 43.2vw;
                    height: 37.3vw;
                    left: 1.2vw;
                    bottom: -23.2vw;
                }

                dl {
                    flex-direction: column;
                    padding-bottom: var(--p30-spa);
                    padding-top: var(--p30-spa);

                    dt {
                        width: 100%;
                        margin-bottom: var(--p15-spa);
                    }

                    dd {
                        width: 100%;
                    }
                }

                .medal {

                    dd {

                        p {
                            margin-bottom: var(--p25-spa);
                        }

                        div {
                            width: 100%;

                            img {
                                margin-bottom: var(--p15-spa);
                            }
                        }
                    }
                }
            }
        }
    }

    .grd-bg {

        &::before {
            width: 100%;
            height: 147.2vw;
            top: var(--p100-spa);
        }

        &::after {
            display: none;
        }

        .history {
        padding-top: var(--p60-spa);
        padding-left: var(--p25-spa);
        padding-right: var(--p25-spa);

        &::before {
            background-image: url(../images/company/history-deco2_sp.png);
            width: 55.5vw;
            height: 33.3vw;
            bottom: -9vw;
            right: 5vw;
        }

            .wrapper {

                &::before {
                    width: 25vw;
                    height: 32vw;
                    right: -0.7vw;
                    top: -26vw;
                }

                &::after {
                    display: none;
                }

                .block {

                    &::after {
                        width: 8px;
                        top: 0;
                        left: 0;
                        height: 101%;
                    }

                    ul {

                        li {
                            display: flex;
                            align-items: flex-start;
                            margin-bottom: var(--p25-spa);
                            gap: var(--p30-spa);

                            .dots {
                                width: 8px;
                                height: 8px;
                                margin-right: 0;
                                margin-top: 1.5vw;
                            }

                            div {
                                width: 85%;

                                .year {
                                    width: 100%;
                                }
                            }

                            .desc {
                                width: 100%;
                            }
                        }

                        .long {

                            .dots {
                                margin-top: 0.7vw;
                            }
                        }
                    }
                }
                
            }
    }
    }    

}

}