.roullete_part {
    width: inherit;
    height: initial;
    margin: 0 auto;
    position: relative;
    display: flow-root
}

    .roullete_part .roullete_layer1_box {
        width: 290px;
        height: 340px;
        margin: 10% auto 40px;
        display: grid;
        position: relative
    }

        .roullete_part .roullete_layer1_box .roullete_layer1_inbox1 {
            width: 54px;
            height: 54px;
            background: url(../img/roullete04.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 9;
            bottom: 115px;
            left: 119px
        }

        .roullete_part .roullete_layer1_box .roullete_layer1_inbox2 {
            width: 290px;
            height: 290px;
            background: url(../img/roullete_layer1_02.1.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 7;
            bottom: -5px
        }

        .roullete_part .roullete_layer1_box .roullete_layer1_inbox3 {
            top: 45px;
            left: -5px;
            position: absolute;
            transform: scale(0.73)
        }

        .roullete_part .roullete_layer1_box .roullete_layer1_inbox4 {
            width: 170px;
            height: 112px;
            background: url(../img/roullete_layer1_01.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 8;
            top: 5px;
            left: 62px
        }

    .roullete_part .roullete_layer2_box {
        width: 290px;
        height: 340px;
        display: grid;
        position: relative
    }

        .roullete_part .roullete_layer2_box .roullete_layer2_inbox1 {
            width: 54px;
            height: 54px;
            background: url(../img/roullete04.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 9;
            bottom: 115px;
            left: 119px
        }

        .roullete_part .roullete_layer2_box .roullete_layer2_inbox2 {
            width: 290px;
            height: 290px;
            background: url(../img/roullete02.1.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 7;
            bottom: -5px
        }

        .roullete_part .roullete_layer2_box .roullete_layer2_inbox3 {
            top: 45px;
            left: -5px;
            position: absolute;
            transform: scale(0.73)
        }

        .roullete_part .roullete_layer2_box .roullete_layer2_inbox4 {
            width: 170px;
            height: 112px;
            background: url(../img/roullete01.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 8;
            top: 5px;
            left: 62px
        }

    .roullete_part .roullete_layer3_box {
        width: 290px;
        height: 340px;
        margin: 10% auto 40px;
        display: grid;
        position: relative
    }

        .roullete_part .roullete_layer3_box .roullete_layer3_inbox1 {
            width: 54px;
            height: 54px;
            background: url(../img/roullete04.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 9;
            bottom: 115px;
            left: 119px
        }

        .roullete_part .roullete_layer3_box .roullete_layer3_inbox2 {
            width: 290px;
            height: 290px;
            background: url(../img/roullete_layer3_02.1.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 7;
            bottom: -5px
        }

        .roullete_part .roullete_layer3_box .roullete_layer3_inbox3 {
            top: 45px;
            left: -5px;
            position: absolute;
            transform: scale(0.73)
        }

        .roullete_part .roullete_layer3_box .roullete_layer3_inbox4 {
            width: 170px;
            height: 112px;
            background: url(../img/roullete_layer3_01.png) top center no-repeat;
            background-size: contain;
            position: absolute;
            z-index: 8;
            top: 5px;
            left: 62px
        }

    .roullete_part .roullete_btnbox {
        width: 120px;
        height: 40px;
        margin: 0 auto 15%;
        padding: 0 40px 0 20px;
        display: grid;
        position: relative;
        text-align: center;
        border-radius: 40px;
        line-height: 40px;
        box-shadow: 0 5px 5px rgba(0,0,0,0.6)
    }

        .roullete_part .roullete_btnbox .btnbox_number {
            width: 40px;
            height: 40px;
            text-align: center;
            border-radius: 40px;
            line-height: 40px;
            position: absolute;
            right: 0
        }

@media only screen and (min-width: 768px) {
    .roullete_part {
        width: 450px
    }

        .roullete_part .roullete_layer1_box {
            width: 450px;
            height: 440px;
            margin: 30% auto 75px
        }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox1 {
                width: 90px;
                height: 90px;
                bottom: 175px;
                left: 177px
            }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox2 {
                width: 450px;
                height: 450px;
                bottom: -5px
            }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox4 {
                width: 280px;
                height: 180px;
                top: -100px;
                left: 85px
            }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox3 {
                top: 65px;
                left: 76px;
                position: absolute;
                transform: scale(1.14)
            }

        .roullete_part .roullete_layer2_box {
            width: 450px;
            height: 440px
        }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox1 {
                width: 90px;
                height: 90px;
                bottom: 175px;
                left: 177px
            }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox2 {
                width: 450px;
                height: 450px;
                bottom: -5px
            }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox4 {
                width: 280px;
                height: 180px;
                top: -100px;
                left: 85px
            }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox3 {
                top: 65px;
                left: 76px;
                position: absolute;
                transform: scale(1.14)
            }

        .roullete_part .roullete_layer3_box {
            width: 450px;
            height: 440px;
            margin: 30% auto 70px
        }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox1 {
                width: 90px;
                height: 90px;
                bottom: 175px;
                left: 177px
            }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox2 {
                width: 450px;
                height: 450px;
                bottom: -5px
            }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox4 {
                width: 280px;
                height: 180px;
                top: -100px;
                left: 85px
            }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox3 {
                top: 65px;
                left: 76px;
                position: absolute;
                transform: scale(1.14)
            }

    .centerbox1_part {
        width: 70%;
        min-height: 800px;
        margin: 5px 15% 70px
    }
}

@media only screen and (min-width: 1024px) {
    .roullete_part {
        width: 400px
    }

        .roullete_part .roullete_layer1_box {
            width: 400px;
            height: 440px;
            margin: 70px auto 40px;
            top: 70px
        }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox1 {
                width: 65px;
                height: 65px;
                bottom: 165px;
                left: 165px
            }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox2 {
                width: 400px;
                height: 400px;
                bottom: -6px
            }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox4 {
                width: 240px;
                height: 170px;
                top: -42px;
                left: 80px
            }

            .roullete_part .roullete_layer1_box .roullete_layer1_inbox3 {
                top: 91px;
                left: 51px;
                position: absolute;
                transform: scale(1)
            }

        .roullete_part .roullete_layer2_box {
            width: 400px;
            height: 440px;
            top: 70px
        }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox1 {
                width: 65px;
                height: 65px;
                bottom: 165px;
                left: 165px
            }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox2 {
                width: 400px;
                height: 400px;
                bottom: -6px
            }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox4 {
                width: 240px;
                height: 170px;
                top: -42px;
                left: 80px
            }

            .roullete_part .roullete_layer2_box .roullete_layer2_inbox3 {
                top: 91px;
                left: 51px;
                position: absolute;
                transform: scale(1)
            }

        .roullete_part .roullete_layer3_box {
            width: 400px;
            height: 440px;
            margin: 70px auto 40px;
            top: 70px
        }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox1 {
                width: 65px;
                height: 65px;
                bottom: 165px;
                left: 165px
            }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox2 {
                width: 400px;
                height: 400px;
                bottom: -6px
            }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox4 {
                width: 240px;
                height: 170px;
                top: -42px;
                left: 80px
            }

            .roullete_part .roullete_layer3_box .roullete_layer3_inbox3 {
                top: 91px;
                left: 51px;
                position: absolute;
                transform: scale(1)
            }

        .roullete_part .roullete_btnbox {
            margin: 130px auto 10px !important;
        }

    .centerbox1_part {
        width: 70%;
        min-height: 750px;
        margin: 5px 15% 70px
    }
}

@media only screen and (max-width: 768px) {
    .roullete_layer2_box {
        margin: 30% auto 70px
    }
}

@media only screen and (max-width: 428px) {
    .roullete_layer2_box {
        margin: 20% auto 70px
    }
}

@media only screen and (max-width: 414px) {
    .roullete_layer2_box {
        margin: 10% auto 70px
    }
}

@media only screen and (max-width: 375px) {
    .roullete_layer2_box {
        margin: 10% auto 50px
    }
}

@media only screen and (max-width: 360px) {
    .centerbox1_part {
        min-height: 500px
    }

    .roullete_part .roullete_layer1_box {
        margin: 14% auto 50px
    }

    .roullete_part .roullete_layer2_box {
        margin: 10% auto 50px
    }

    .roullete_part .roullete_layer3_box {
        margin: 14% auto 50px
    }
}