.rich_background{
    background-image: url(../img/rich.jpg);
}
.rich_overview_background{
    background-color: #f3e7ca;
}
.reasonable_background{
    /* background-color: #7C39BA; */
    background-image: url(../img/reasonable.jpg);
}
.reasonable_overview_background{
    background-color: #e9efcf;
}
.general_background{
    background-image: url(../img/general.jpg);
}
.general_overview_background{
    background-color: #dce3e9;
}

@media screen and (max-width: 850px) {
    body{
        font-size:4vw;
    }
    .plan_title{
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: #b44c97;
    }

    .plan_title h2{
        color: #b44c97;
        font-size: 6vw;
        background-color: #FFF;
        width: 100%;
        height: 10vw;
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
    }

    .plan_title img{
        height: 25vw;
    }

    .plan_intro_detail{
        margin: 6vw;
        font-size: 4vw;
        line-height: 1.3;
    }

    .plan_feature{
        margin: 5vw;
        border: 0.3vw solid;
        font-size:4vw;
        line-height: 1.2;
    }

    .plan_feature h1{
        font-size: 4.3vw;
        background-color: #a8c97f;
        color: #FFFFFF;
        height: 11vw;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom:7vw;
    }
    .plan_feature_content{
        margin: 6vw 0;
    }
    .plan_feature_content a{
        color: #000;
    }
    .plan_feature_content h3{
        margin: 1vw 4vw;
    }
    .plan_feature_content h3 span{
        color:#EB3F3E;
    }
    .plan_feature_content p{
        padding: 4vw;
    }

    .funeral_detail{
        font-size:4.5vw;
        display: flex;
        justify-content: center;
        border: 1px solid;
        width: 80vw;
        margin: 4vw auto;
        height: 10vw;
        align-items: center;
        border-radius: 1.5vw;
        background-color: #FFF;
    }

     .funeral_detail_triangle{
        width: 4vw;
        height: 4vw;
        border-top: 1.5vw solid #b44c97;
        border-right: 1.5vw solid #b44c97;
        transform: rotate(45deg);
        position: relative;
        left: 18vw;
     }

    .funeral_detail_content{
        display: none;
        width: 80vw;
        margin: 0 auto;
        border:0.3vw solid;
    }
    .funeral_detail_content p{
        padding:2vw;
        margin: 2vw 0;
    }
    .funeral_detail_content span{
        color:#EB3F3E;
    }

    .arrow_up{
        transform: rotate(315deg);
        transition: 0.2s;
        top: 1vw;
    }

    .flow_list{
        display: flex;
        justify-content: center;
        margin-bottom: 10vw;
    }
    .flow_list li{
        width: 4.5vw;
        height: 30vw;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .flow_list_content{
        font-size: 4vw;
        width: 5vw;
        border: 0.7vw solid #73C0D6;
        padding: 1vw;
        border-radius: 2vw;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }
    .flow_list_triangle{
        width: 0;
        height: 0;
        border: 2.5vw solid transparent;
        border-right: 0;
        border-left: 3vw solid #73C0D6;
        position: relative;
        top: 2vw;
    }
    .flow_list_cancel{
        position: relative;
        color: #C0C0C0;
    }
    .flow_list_cancel span{
        background-color: #C0C0C0;
        width: 0.5vw;
        height: 31.5vw;
        transform: rotate(10deg);
        position: absolute;
        border-radius: 30vw;
    }
    #plan_list h2{
        display: flex;
        justify-content: center;
        align-items: center;
        height: 15vw;
        font-size: 6vw;
        color: #FFFFFF;
        background-color: #7ebeab;
    }


    #plan_list .button_box_left{
        margin: 7vw auto;
    }
    #plan_list .to_form_button{
        margin-bottom:  7vw;
    }
    .to_form_button a::after{
        color: #FFF;
    }
    #plan_list h3{
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        height:15vw;
        font-size:5.5vw;
    }
    .plan_h3_box p{
        padding: 5vw;
        font-size:4.5vw;
        line-height: 1.3;
    }
    .plan_content_detail{
        padding: 5vw;
        font-size: 4vw;
        line-height: 1.3;
    }
    .plan_overview_div{
        border: 0.3vw solid;
        width: 80vw;
        margin: 5vw auto;
        line-height: 1.5;
        /* margin-bottom: 5vw; */
    }
    .overview_attention{
        font-size:3.5vw;
    }
    .plan_overview{
        font-size:5vw;
        border-bottom: 0.3vw solid;
        padding: 4vw 6vw 4vw 9vw;
    }
    .plan_example_box{
        color: #FFFFFF;
        width: 39vw;
        padding: 1vw;
        text-align: center;
        font-size: 4vw;
        margin: 2vw;
    }
    .plan_exmaple_box_content{
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 3vw;
        font-size: 4.5vw;
        /* padding: 3vw; */
        width: 68vw;
        margin: 0 auto;
    }
    .plan_example_box_content ul{
        list-style: circle;
        width: 67vw;
        margin: 10px auto;
        position: relative;
        left: 3vw;
    }
    .plan_example_box_content ul li{
        margin: 2vw 0;
    }


    .plan_rich{
        width: 98vw;
        border: 1vw solid #DFB354;
        margin: 8vw auto;
    }

    .plan_rich_imgbox img{
        width: 98vw;
    }
    .plan_rich_imgbox{
        background:#DFB354;
    }


    .plan_general{
        width: 98vw;
        border: 1vw solid #0A1B39;
        margin: 8vw auto;
    }
    .plan_general_imgbox img{
        width: 98vw;
    }
    .plan_general_imgbox{
        background:#0A1B39;
    }



    .plan_reasonable{
        width: 98vw;
        border: 1vw solid #325F34;
        margin: 8vw auto;
    }
    .plan_reasonable_imgbox img{
        width: 98vw;
    }
    .plan_reasonable_imgbox{
        background:#325F34;
    }



    .plan_no_religion{
        width: 98vw;
        border: 1vw solid #005953;
        margin: 8vw auto;
    }
    .plan_no_religion h3{
        background-color: #005953;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        height:15vw;
        font-size:5.5vw;
    }
    .plan_no_religion_imgbox{
        background-color: #005953;
    }
    .plan_no_religion_imgbox img{
        width: 98vw;
    }
    .plan_no_religion p{
        margin: 5vw;
        font-size: 4vw;
    }
    .plan_no_religion_content{
        border: 0.3vw solid;
        width: 90vw;
        margin: 0 auto;
        line-height: 1.5;
        margin-bottom: 5vw;
    }
    .plan_no_religion_overview{
        font-size: 5vw;
        background-color: #d7f2df;
        border-bottom: 0.3vw solid;
        padding: 2vw;
        text-align: center;
    }

    .plan_no_religion_content p span{
        color:#EB3F3E;
    }

    .plan_only_cremate{
        width: 98vw;
        border:1vw solid #8A000D;
        margin: 8vw auto;
    }
    .plan_only_cremate h3{
        background-color: #8A000D;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        height:15vw;
        font-size:5.5vw;
    }
    .plan_only_cremate p{
        margin: 5vw;
        font-size: 4vw;
    }
    .plan_only_cremate_content{
        border: 0.3vw solid;
        width: 90vw;
        margin: 0 auto;
        line-height: 1.5;
        margin-bottom: 5vw;
    }
    .plan_only_cremate_content_attention{
        font-size:3.5vw;
    }
    .plan_only_cremate_overview{
        font-size: 5vw;
        background-color: #DDA2A8;
        border-bottom: 0.3vw solid;
        padding: 2vw;
        text-align: center;
    }
    .only_cremate_example_box{
        background-color: #7C39BA;
        color: #FFFFFF;
        width: 15vw;
        height: 5vw;
        text-align: center;
        font-size: 3.5vw;
        margin: 2vw;
    }
    .only_cremate_exmaple_box_content{
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 3vw;
    }
    .plan_only_cremate_imgbox{
        background-color: #8A000D;
    }
    .plan_only_cremate_imgbox img {
        width: 98vw;
    }

    .plan_only_cremate_content p span{
        color:#EB3F3E;
    }
    .emphasis{
        font-size: 5vw;
        font-weight: bold;
        color: #d51237;
    }
    .emphasis span{
        font-size: 6vw;
        }
    .more_reasonable{
        width: 97vw;
        margin: 30px auto;
        background-color: #FFF;
        border: 5px solid #4B9C3C;
        font-size: 4vw;
        padding: 20px 0;
    }
    .more_reasonable p{
        width: 85vw;
        margin: 0 auto;
    }
    .more_reasonable h4{
        color: #4B9C3C;
        font-size: 5.5vw;
        width: 57vw;
        padding-left: 4vw;
        padding-top: 2vw;
    }
    .more_reasonable h4 span{
        font-size: 4vw;
    }

    .more_reasonable_flex_box{
        display: flex;
    }
    .more_reasonable_flex_box img{
        height: 23vw;
        position: relative;
    }
}
@media screen and (min-width: 850px) {
    body{
        font-size:15px;
    }
    .plan_title{
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: #b44c97;
    }
    .plan_title h2{
        color: #b44c97;
        font-size: 30px;
        background-color: #FFF;
        width: 100%;
        height: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
    }

    .plan_title img{
        height: 180px;
    }

    .plan_intro_detail{
        line-height: 1.3;
        font-size: 27px;
        margin: 50px auto;
        width: 870px;
        text-align: center;
        color: #2e425b;
        border-bottom: 2px solid #2e425b;
    }

    .plan_feature{
        margin: 50px;
        border: 3px  solid;
        font-size: 18px;
        line-height: 1.2;
        width: 1000px;
        background-color: rgba(255,255,255,0.5);
        margin: 10px auto 50px auto;
    }
    .plan_feature h1{
        font-size: 21px;
        background-color: #b44c97;
        color: #FFFFFF;
        height: 55px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 50px;
        width: 999px;
    }
    .plan_feature_content{
        margin-bottom: 40px;
    }

    .plan_feature_content h3{
        margin: 20px 50px;
        font-size: 21px;
        text-align: center;
    }
    .plan_feature_content span{
        color:#EB3F3E;
    }
    .plan_feature_content p{
        /* width: 800px; */
        margin-left: 15px;
        line-height: 1.5;
        padding: 5px 70px;
    }
    .plan_feature_content a{
        color: #000;
    }

    .funeral_detail{
        font-size: 21px;
        display: flex;
        justify-content: center;
        border: 1px solid;
        width: 803px;
        margin: 27px auto;
        height: 58px;
        align-items: center;
        background-color: rgba(255,255,255,0.5);
    }

     .funeral_detail_triangle{
        width: 20px;
        height: 20px;
        border-top: 6px solid #b44c97;
        border-right: 6px solid #b44c97;
        transform: rotate(45deg);
        position: relative;
        left: 245px;
     }

    .funeral_detail_content{
        display: none;
        width: 800px;
        margin: 0 auto;
        border: 1px solid;
        background-color: rgba(255,255,255,0.5);
    }
    .funeral_detail_content p{
        padding:25px;
        margin: 15px 0;
    }
    .funeral_detail_content span{
        color:#EB3F3E;
    }

    .arrow_up{
        transform: rotate(315deg);
        transition: 0.2s;
        top: 9px;
    }

    .flow_list{
        display: flex;
        justify-content: center;
        margin-bottom: 50px;
        user-select: none;
    }
    .flow_list li{
        width: 30px;
        height: 153px;
        display: flex;
        align-items: center;
        justify-content: center;
        letter-spacing: 8px;
        margin: 4px;
    }
    .flow_list_content{
        font-size: 22px;
        width: 40px;
        border: 3px solid #b44c97;
        padding: 12px;
        border-radius: 10px;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }
    .flow_list_triangle{
        border: 10px solid transparent;
        border-right: 0;
        position: relative;
        border-left: 20px solid #b44c97;
        width: 0;
        height: 0;
        top: 11px;
    }
    .flow_list_cancel{
        position: relative;
        color: #C0C0C0;
    }
    .flow_list_cancel span{
        background-color: #C0C0C0;
        width: 5px;
        height: 183px;
        transform: rotate(16deg);
        position: absolute;
        border-radius: 30px;
    }
    #plan_list h2{
        display: flex;
        justify-content: center;
        align-items: center;
        height: 70px;
        font-size: 30px;
        color: #FFFFFF;
        background-color: #7ebeab;
    }

    .plan_h3_box h3{
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        height: 70px;
        font-size: 27px;
    }
    .plan_flex_box1{
        /* height: 300px; */
        display: flex;
    }
    .plan_flex_box2{
        /* height: 300px; */
        align-items: center;
        display: flex;
        margin-bottom: 20px;
    }
    .plan_main_claim{
        font-size: 27px;
        line-height: 1.3;
        width: 900px;
        padding: 10px 40px;
        color: #2e425b;
        border-bottom: 2px solid #2e425b;
        margin: 20px auto;
        text-align: center;
    }
    .plan_h3_box{
        width:100%;
    }
    .emphasis{
        font-size: 23px;
    }
    .emphasis span{
        font-size: 32px;
        color:#d51237;
    }
    .plan_content_detail{
        font-size: 19px;
        line-height: 1.3;
        padding: 0 40px;
        width: 462px;
        border-left: 2px dotted;
        margin-top: 20px;
    }
    .plan_overview_div{
        margin: 0 auto;
        width: 500px;
        line-height: 1.5;
    }
    .overview_attention{
        font-size: 18px;
        margin-top: 9px;
    }
    .plan_overview{
        height: 128px;
        padding: 26px 112px;
        line-height: 1.5;
    }

    .plan_example_box{
        color: #FFFFFF;
        width: 203px;
        padding: 7px;
        text-align: center;
        font-size: 19px;
        margin: 17px 0 0 40px;
    }
    .plan_exmaple_box_content{
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 3vw;
        font-size: 4.5vw;
        width: 68vw;
        margin: 0 auto;
    }
    .plan_example_box_content ul{
        list-style: circle;
        /* width: 334px; */
        position: relative;
        left: 18px;
        line-height: 1;
        font-size: 19px;
        margin: 34px 0;
        padding: 0px 49px;
    }
    .plan_example_box_content ul li{
        margin: 2vw 0;
    }
    .plan_rich{
        width: 1100px;
        border: 5px solid #DFB354;
        margin: 40px auto;
        background-color: rgba(255,255,255,0.5);
    }
    .plan_rich_imgbox img{
        width: 332px;
        height: 250px;
    }
    .plan_general{
        border: 5px solid #0A1B39;
        width: 1100px;
        margin: 40px auto;
        background-color: rgba(255,255,255,0.5);
    }
    .plan_general_imgbox img{
        width: 332px;
        height: 250px;
    }

    .plan_reasonable{
        width: 1100px;
        border: 5px solid #325F34;
        margin: 40px auto;
        background-color: rgba(255,255,255,0.5);
    }
    .plan_reasonable_imgbox img{
        width: 334px;
            height: 250px;
    }
    .plan_no_religion{
        width: 1100px;
        border: 4px solid #005953;
        margin: 0px auto;
        margin-bottom: 40px;
        background-color: rgba(255,255,255,0.5);
    }
    .plan_no_religion h3{
        background-color: #005953;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        height: 50px;
        font-size: 20px;
    }
    .plan_no_religion_imgbox{
        width: 400px;
        background-color: #005953;
    }
    .plan_no_religion_imgbox img{
        width: 312px;
    }
    .plan_no_religion_content p{
        margin: 50px;
        font-size: 19px;
    }
    .plan_no_religion_content{
        /* border: 0.3vw solid; */
        /* width: 80vw; */
        margin: 0 auto;
        line-height: 1.5;
    }
    .plan_no_religion_overview{
        font-size: 24px;
        background-color: #d7f2df;
        /* border-bottom: 3px solid; */
        padding: 55px;
        text-align: center;
        height: 32px;
    }

    .plan_no_religion_content p span{
        color:#EB3F3E;
    }
    .other_plan_box{
        /* display: flex; */
        /* width: 1100px; */
        /* justify-content: space-between; */
        /* margin: 0 auto; */
    }
    .no_religion_claim{
    font-size: 24px;
    line-height: 1.3;
    width: 660px;
    padding: 10px 40px;
    color: #2e425b;
    border-bottom: 2px solid #2e425b;
    margin: 20px auto;
    text-align: center;
    }

    .plan_only_cremate{
        width: 1100px;
        border: 5px solid #8A000D;
        margin: 0 auto;
        background-color: rgba(255,255,255,0.5);
    }
    .plan_only_cremate_imgbox{
        background-color:  #8A000D; 
    }
    .plan_only_cremate_imgbox img{
        width: 284px;
        /* height: 300px; */
    }
    .plan_only_cremate h3{
        background-color: #8A000D;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #FFFFFF;
        height: 50px;
        font-size: 20px;
    }
    .plan_only_cremate_content p{
        margin: 50px;
        font-size: 18px;
    }
    .plan_only_cremate_content{
        /* border: 0.3vw solid; */
        width: 1100px;
        margin: 0 auto;
        line-height: 1.5;
    }
    .plan_only_cremate_content_attention{
        font-size:3.5vw;
    }
    .plan_only_cremate_overview{
        background-color: #DDA2A8;
        font-size: 28px;
        padding: 55px;
        text-align: center;
        height: 32px;
        /* color: #d51237; */
    }
    .only_cremate_example_box{
        background-color: #7C39BA;
        color: #FFFFFF;
        width: 15vw;
        height: 5vw;
        text-align: center;
        font-size: 3.5vw;
        margin: 2vw;
    }
    .only_cremate_exmaple_box_content{
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 3vw;
    }

    .plan_only_cremate_content p span{
        color:#EB3F3E;
    }
    .other_plan_flex_box{
        display: flex;
    }
    .no_religion_h3_box{
        width: 100%;
    }
    .only_cremate_h3_box{
        width: 100%;
    }
    .only_cremate_claim{
        font-size: 24px;
        line-height: 1.3;
        width: 550px;
        padding: 10px 40px;
        color: #2e425b;
        border-bottom: 2px solid #2e425b;
        margin: 25px auto;
        text-align: center;
    }
    .more_reasonable{
        width: 1100px;
        margin: 30px auto;
        background-color: #FFF;
        border: 5px solid #4B9C3C;
        font-size: 20px;
        padding: 20px 0;
    }
    .more_reasonable p{
        width: 680px;
        padding: 15px 0 20px 100px;
    }
    .more_reasonable h4{
        color: #4B9C3C;
        font-size: 35px;
        padding: 15px 15px 0 100px;
    }
    .more_reasonable h4 span{
        font-size:23px;
    }
    .more_reasonable_flex_box{
        display: flex;
        justify-content: space-between;
    }
    .more_reasonable h4 br{
        display: none;
    }
    .to_form_button a{
        color: #FFF;
    }
}

    