.d_none{
    display: none;
}
.s_bg{
    width: 100%;
    height: 100%;
    background-image: url(../img/joukyu/bg1.png);
    background-size: cover;
    padding-bottom: 100px;
}
.s1_c1{
    max-width: 1220px;
    width: 100%;
    margin: 0 auto;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 44px;
}
.s_complete{

}
.s1_c1 img{
    width: 161px;
}
.s1_p1{
    font-size: 42px;
    font-weight: 700;
}
.s1_c2{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 240px;
}
.s_bg_2{
    width: 100%;
    height: 100%;
    background-image: url(../img/joukyu/bg2.png);
    background-size: cover;
    padding-bottom: 100px;
}
.s2_c1{
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding-top: 100px;
    gap: 44px;
}
.s2_c1 img{
    width: 1200px;
}
.s2_p1{
    font-size: 35px;
    font-weight: 700;
    line-height: 53px;
    margin-top: 53px;
}

.s2_c2{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ans{
    width: 722px;
    margin: 0 auto;
    margin-top: 35px;
}
.ans2{
    width: 922px;
}
.ans img{
    width: 100%;
}
.bs{
    width: 450px;
    display: flex;
    flex-direction: column;
    row-gap: 50px;
}
.bs button{
    width: 450px;
    height: 90px;
    border-radius: 24px;
    font-size: 40px;
    font-weight: 700;
    background-color: #FFF6E1;
    border: #099B5E 4px solid;
    transition: .3s;
    cursor: pointer;
}
.bs button:hover{
    transform: scale(1.1);
}
.s_bg_2 .btns{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.s_bg_3 .btns{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.btns .next{
    width: 450px;
    height: 90px;
    border-radius: 24px;
    font-size: 40px;
    font-weight: 700;
    background-color: #099B5E;
    border: none;
    transition: .3s;
    cursor: pointer;
    color: #FFF;
}
.btns .next:hover{
    transform: scale(1.1);
}
.s1_c2 img{
    width: 228px;
}
.s_bg_3{
    width: 100%;
    height: 100%;
    background-image: url(../img/joukyu/bg3.png);
    background-size: cover;
    padding-bottom: 100px;
}
.s3_c1{
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 44px;
}
.s3_c1 img{
    width: 1200px;
}
.s3_p1{
    font-size: 35px;
    font-weight: 700;
    line-height: 53px;
    margin-top: 53px;
}
.s3_p{
    font-size: 42px;
    font-weight: 700;
    line-height: 66px;
    margin-top: 24px;
}
.s3_c2{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.s3_c2 img{
    width: 722px;
}
.s3_c3{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
    margin-top: 50px;
}
.s3_c3 img{
    width: 722px;
}
.btns{
    max-width: 1200px;
    width: 100%; 
    margin: 0 auto;
    margin-top: 100px;
}
.btns a button{
    width: 360px;
    height: 70px;
    border-radius: 24px;
    font-size: 30px;
    font-weight: 700;
    color: #FFF;
    background-color: #99917E;
    border: unset;
    cursor: pointer;
    transition: .3s;
}
.btns a button:hover{
    transform: scale(1.1);
}
.complete_head{
    width: 100%;
    padding-top: 85px;
    text-align: center;
}
.kekkka{
    width: 240px;
    height: auto;
    margin-bottom: 70px;
}
.s4_img{
    width: 950px;
}
.s4_c2{
    width: 1200px;
    margin: 0 auto;
    text-align: right;
    position: relative;
}
.s4_c2 img{
    width: 235px;
}
.btns_c{
    text-align: center;
}
.btns_c .b_b3{
    width: 450px;
    height: 90px;
    border-radius: 24px;
    font-size: 40px;
    font-weight: 700;
    background-color: #099B5E;
    border: none;
    transition: .3s;
    cursor: pointer;
    color: #FFF;
}
.btns_c .b_b3:hover{
    transform: scale(1.1);
}
.w-427{
    width: 427px !important;
}
.ans_sm1{
    width: 360px !important;
}
.ans_sm2{
    width: 270px !important;
}
.ans_sm3{
    width: 495px !important;
}
.ans_sm4{
    width: 315px !important;
}
.ans_sm5{
    width: 270px !important;
}

@media only screen and (max-width:500px) {
    .s_bg_2 {
        width: 100%;
        min-height: 100vh;
    }
    .s_bg_3 {
        width: 100%;
        min-height: 100vh;
    }
    .s1_c1 {
        flex-wrap: wrap;
        padding: 0 20px;
        padding-top: 50px;
    }
    .s1_p1 {
        font-size: 30px;
        font-weight: 700;
    }
    .s1_c2 {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 30px;
        flex-direction: column-reverse;
        margin-top: 50px;
    }
    .s1_c2 img {
        width: 30%;
    }
    .bs {
        width: 100%;
        display: flex;
        flex-direction: column;
        row-gap: 40px;
        padding: 0 20px;
        margin-top: 50px;
    }
    .bs button {
        width: 100% !important;
        height: 70px;
        border-radius: 24px;
        font-size: 30px;
        font-weight: 700;
        background-color: #FFF6E1;
        border: #F48445 4px solid;
        transition: .3s;
        cursor: pointer;
        color: #3F2929 !important;
    }
    .btns {
        padding: 0 20px;
    }
    .btns a button {
        width: 100% !important;
        height: 70px;
        border-radius: 24px;
        font-size: 30px;
        font-weight: 700;
        color: #FFF;
        background-color: #99917E;
        border: unset;
        cursor: pointer;
        transition: .3s;
    }

    /* 不正解１ */
    .s2_c1 img {
        width: 100%;
    }
    .ans_sm1 {
        width: 80% !important;
    }
    .s2_c1 {
        padding: 0 20px;
        padding-top: 50px;
    }
    .s2_p1 {
        font-size: 25px;
        font-weight: 700;
        line-height: 45px;
        margin-top: 53px;
    }
    .s3_p1 {
        font-size: 25px;
        font-weight: 700;
        line-height: 45px;
        margin-top: 53px;
    }
    .s_bg_2 .btns {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        flex-direction: column-reverse;
        gap: 30px;
    }
    .s_bg_3 .btns {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        flex-direction: column-reverse;
        gap: 30px;
    }
    .s_bg_4 .btns {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        flex-direction: column-reverse;
        gap: 30px;
    }
    .s2_c2{
        width: 100% !important;
        padding: 0 20px;
    }
    .btns .next {
        width: 100%;
        height: 70px;
        border-radius: 24px;
        font-size: 30px;
    }
    .btns a{
        width: 100%;
    }
    .w-427 {
        width: 60% !important;
    }
    .w-750 {
        width: 100% !important;
    }
    .bs_l{
        width: 100% !important;
    }
    .ans_sm4 {
        width: 100% !important;
    }
    .s4_img {
        width: 100%;
    }
    .s3_p {
        font-size: 30px;
        font-weight: 700;
        line-height: 55px;
        margin-top: 24px;
    }
    .s4_c2 {
        width: 100%;
        margin: 0 auto;
        text-align: right;
        position: relative;
    }
    .s4_c2 img {
        width: 30%;
    }
    .btns_c{
        width: 100%;
    }
    .btns_c a{
        width: 100%;
    }
    .h-145{
        font-size: 23px !important;
        padding-left: 20px;
    }
    .br_span{
        display: unset;
    }
    .w-973 {
        width: 100% !important;
    }
    .btns_c .b_b3 {
        width: 100%;
        height: 90px;
        border-radius: 24px;
        font-size: 30px;
        font-weight: 700;
        background-color: #F48445;
        border: none;
        transition: .3s;
        cursor: pointer;
        color: #FFF;
    }
    .s_bg{
        min-height: 100vh;
    }
    .btns_c {
        width: 100%;
        padding: 0 20px;
    }
    .complete_head {
        width: 100%;
        padding: 0 20px;
        padding-top: 85px;
        text-align: center;
    }
    .ans_sm3 {
        width: 100% !important;
    }
    .mt-200{
        margin-top: 70px;
    }
}