@charset "utf-8";


/* template
   ================================================================== */
.singlemother-project p{
    font-size: 3.6vw;
    color: #03386D;
}

.f18{
    font-size: 3.8vw !important;
}

.f20{
    font-size: 4.0vw !important;
}

.f23{
    font-size: 4.3vw !important;
}

.f25{
    font-size: 4.6vw !important
}

.f28{
    font-size: 5.0vw !important;
}

.f39{
    font-size: 6.5vw !important;
}

.singlemother-project span{
    color: inherit;
}

.pink{
    color: #F07586 !important;
}

.bold{
    font-weight: 700 !important;
}

.singlemother-project img{
    width: 100%;
}

.singlemother-project footer{
    margin: 0;
}

@media screen and (max-width : 499px){
    
    .singlemother-project footer .bottom_box .inner{
        padding-bottom: 10vw;
    }
    
}


/* border_title
   ================================================================== */
.border_title{
    padding: 2vw 0;
    font-size: 5.0vw;
    font-weight: 700;
    line-height: 140%;
    text-align: center;
    font-family: 'Zen Maru Gothic';
    color: #F01843;
    border-top: 1px solid #F01843;
    border-bottom: 1px solid #F01843;
}


/* project_kv
   ================================================================== */
.project_kv .photo{
    margin: 0 auto;
    max-width: 1000px;
    position: relative;
    z-index: 1;
}

.project_kv .photo img{
    width: 100%;
}


/* project_bg_wrap
   ================================================================== */
.project_bg_wrap{
    padding: 0 0 0;
    position: relative;
}

.project_bg_wrap:before{
	content: "";
	background: #FEF7F6;
	width: 100%;
	height: calc(100% + 15vw);
	position: absolute;
	top: -15vw;
	left: 0;
    border-radius: 60px 60px 0 0;
    display: none;
}

.project_bg_wrap .white_bg{
	position: relative;
    z-index: 1;
    background: #fff;
}


/* project_counter
   ================================================================== */
.project_counter{
    padding: 6vw 0 0;
}

.project_counter .photo{
    margin: 0 auto;
}

.project_counter .logo{
    margin: 15vw auto 0;
    width: 50vw;
    line-height: 0;
}

.project_counter .title{
    margin: 3vw auto 0;
    font-size: 6vw;
    font-weight: 900;
    color: #F01843;
    text-align: center;
    font-family: 'Zen Maru Gothic';
}

.project_counter .number_ttl{
    margin: 3vw auto 0;
    text-align: center;
}

.project_counter .number_ttl > span{
    padding: 1vw 7vw;
    font-size: 4vw;
    line-height: 150%;
    font-weight: 700;
    background: #FBECEF;
    color: #F01843;
    display: inline-block;
    border-radius: 100px;
}

.project_counter .number_text{
    margin: 0 auto 0;
    text-align: center;
}

.project_counter .number_text > span{
    padding: 0 1vw 2vw;
    font-size: 16vw;
    line-height: 150%;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #F01843;
    background-image: url("../images/singlemother-project/counter_line.svg");
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: auto 2vw;
}

.project_counter .note{
    margin: 7vw auto 0;
    font-size: 3.2vw;
    text-align: center;
}


/* project_participate
   ================================================================== */
.project_participate{
    padding: 15vw 0 0;
}

.project_participate .list{
    margin: 10vw auto 0;
}

.project_participate .list > li{
    margin: 6vw auto 0;
    padding: 4vw 4vw 8vw;
    border-radius: 10px;
    background: #F2F8FE;
}

.project_participate .list > li.number2{
    background: #F2F7F1;
}

.project_participate .list > li.number3{
    background: #FEF8EA;
}

.project_participate .list .list_ttl{
    display: flex;
    align-items: center;
}

.project_participate .list .list_ttl > span{
    display: block;
    line-height: 1;
    font-weight: 700;
}

.project_participate .list .list_ttl .number{
    margin-right: 3vw;
    padding: 0 0 1vw;
    font-size: 7vw;
    width: 12vw;
    height: 12vw;
    color: #fff;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    background: #7CB1E4;
}

.project_participate .list > li.number2 .list_ttl .number{
    background: #7BB86D;
}

.project_participate .list > li.number3 .list_ttl .number{
    background: #FDC036;
}

.project_participate .list .list_ttl .siz_l{
    font-size: 8vw;
    color: #F07586;
}

.project_participate .list > li.number2 .list_ttl .siz_l{
    color: #7BB86D;
}

.project_participate .list > li.number3 .list_ttl .siz_l{
    color: #FDC036;
}

.project_participate .list .list_ttl .siz_s{
    font-size: 5vw;
    color: #03386D;
}

.project_participate .list > li > *:not(.list_ttl){
    margin-left: 15vw;
}

.project_participate .list p{
    margin: 3vw 0 0;
    font-weight: 700;
}

.project_participate .list p + p{
    margin-top: 1vw;
}

.project_participate .list .search{
    margin: 3vw 0 0;
    line-height: 0;
    width: 60vw;
}

.project_participate .list .btn{
    margin: 5vw 0 0;
    line-height: 0;
}

.project_participate .list .btn a{
    width: 60vw;
    height: 10vw;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #7BB86D;
    border-radius: 100px;
}

.project_participate .list .btn a span{
    font-size: 4vw;
    font-weight: 500;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.project_participate .list .btn a span img{
    margin-right: 2vw;
    width: 6vw;
}

.project_participate .list .item03{
    margin: 3vw 0 0;
    line-height: 0;
    width: 66vw;
}


/* project_activity
   ================================================================== */
.project_activity{
    padding: 15vw 0 0;
}

.project_activity .photo{
    margin: 6vw auto 0;
}

.project_activity .logo{
    margin: 6vw auto 0;
    width: 50vw;
    line-height: 0;
}

.project_activity .text_box{
    margin: 10vw auto 0;
}

.project_activity .text_box p{
    margin: 3vw auto 0;
}

.project_activity .bg_box{
    margin: 8vw auto 0;
    padding: 5vw 4vw 8vw;
    display: flex;
    background: #F2F8FE;
    border-radius: 10px;
}

.project_activity .bg_box .icon{
    width: 10vw;
    line-height: 0;
}

.project_activity .bg_box .right{
    padding: 0 0 0 3vw;
    width: calc(100% - 10vw);
    box-sizing: border-box;
}

.project_activity .bg_box .right p{
    margin: 3vw 0 0;
}


/* project_continue
   ================================================================== */
.project_continue{
    padding: 15vw 0 0;
}

.project_continue .pc_flex{
    margin: 6vw 0 0;
}

.project_continue .photo{
    margin: 0 5vw 1vw 0;
    width: 30vw;
    float: left;
}

.project_continue .text_box{
    padding: 4vw 0 0;
}


/* project_support
   ================================================================== */
.project_support{
    padding: 15vw 0 0;
}

.project_support .photo{
    margin: 6vw 0 0;
}

.project_support p{
    padding: 4vw 0 0;
}


/* project_search
   ================================================================== */
.project_search{
    padding: 15vw 0 25vw;
}

.project_search .photo{
    margin: 6vw 0 0;
}

.project_search .logo{
    margin: 6vw auto 0;
    width: 50vw;
    line-height: 0;
}

.project_search .search{
    margin: 3vw auto 0;
    line-height: 0;
    width: 60vw;
}

.project_search p{
    padding: 4vw 0 0;
    font-size: 4.2vw;
    font-weight: 700;
    text-align: center;
}


@media screen and (min-width : 500px){
    

    /* template
       ================================================================== */
    .singlemother-project p{
        font-size: 1.6vw;
        line-height: 2.8vw;
    }
    
    .f18{
        font-size: 1.8vw !important;
    }

    .f20{
        font-size: 2.5vw !important;
    }

    .f23{
        font-size: 2.3vw !important;
    }

    .f25{
        font-size: 2.5vw !important;
    }

    .f28{
        font-size: 2.8vw !important;
    }

    .f39{
        font-size: 3.9vw !important;
    }


    /* border_title
       ================================================================== */
    .border_title{
        padding: 1.4vw 0;
        font-size: 2.6vw;
    }


    /* project_kv
       ================================================================== */
    .project_kv .photo{
        max-width: 1000px;
    }

    .project_bg_wrap:before{
        display: block;
    }


    /* project_bg_wrap
       ================================================================== */
    .project_bg_wrap{
        padding: 0 0 13.0vw;
    }

    .project_bg_wrap:before{
        height: calc(100% + 6.5vw);
        top: -6.5vw;
    }

    .project_bg_wrap .white_bg{
        padding: 0 5.0vw;
    }


    /* project_counter
       ================================================================== */
    .project_counter{
        padding: 2.6vw 0 0;
    }

    .project_counter .photo{
        margin: 0 auto;
    }

    .project_counter .logo{
        margin: 4.0vw auto 0;
        width: 20.0vw;
    }

    .project_counter .title{
        margin: 1.4vw auto 0;
        font-size: 3.0vw;
    }

    .project_counter .number_ttl{
        margin: 1.2vw auto 0;
    }

    .project_counter .number_ttl > span{
        padding: .5vw 3.3vw;
        font-size: 2.0vw;
    }

    .project_counter .number_text{
        margin: 0 auto 0;
    }

    .project_counter .number_text > span{
        padding: 0 .5vw 1.5vw;
        font-size: 8.4vw;
        background-size: auto 1.0vw;
    }

    .project_counter .note{
        margin: 2.3vw auto 0;
        font-size: 1.2vw;
    }


    /* project_participate
       ================================================================== */
    .project_participate{
        padding: 7.0vw 0 0;
    }

    .project_participate .list{
        margin: 4.5vw auto 0;
    }

    .project_participate .list > li{
        margin: 2.5vw auto 0;
        padding: 2.6vw 2.6vw 3.5vw;
    }

    .project_participate .list .list_ttl .number{
        margin-right: 2.5vw;
        padding: 0 0 .6vw;
        font-size: 5.0vw;
        width: 8.0vw;
        height: 8.0vw;
    }

    .project_participate .list .list_ttl .siz_l{
        font-size: 5.0vw;
    }

    .project_participate .list .list_ttl .siz_s{
        font-size: 3.8vw;
    }

    .project_participate .list > li > *:not(.list_ttl){
        margin-left: 10.5vw;
    }

    .project_participate .list p{
        margin: 1.0vw 0 0;
        font-size: 1.8vw;
    }

    .project_participate .list p + p{
        margin-top: .5vw;
    }

    .project_participate .list .search{
        margin: 0 0 0;
        width: 35.0vw;
    }

    .project_participate .list .btn{
        margin: 2.2vw 0 0;
    }

    .project_participate .list .btn a{
        width: 33.5vw;
        height: 6.0vw;
    }

    .project_participate .list .btn a span{
        font-size: 2.3vw;
    }

    .project_participate .list .btn a span img{
        margin-right: 1.6vw;
        width: 3.5vw;
    }

    .project_participate .list .item03{
        margin: 1.0vw 0 0;
        width: 43.0vw;
    }


    /* project_activity
       ================================================================== */
    .project_activity{
        padding: 6.0vw 0 0;
    }

    .project_activity .photo{
        margin: 3.0vw auto 0;
    }

    .project_activity .logo{
        margin: 3.0vw auto 0;
        width: 20.0vw;
    }

    .project_activity .text_box{
        margin: 5.0vw auto 0;
        text-align: center;
    }

    .project_activity .text_box p{
        margin: 1.0vw auto 0;
    }

    .project_activity .bg_box{
        margin: 3.0vw auto 0;
        padding: 3.0vw 2.5vw 4.0vw;
    }

    .project_activity .bg_box .icon{
        width: 5.9vw;
    }

    .project_activity .bg_box .right{
        padding: 0 0 0 3.2vw;
        width: calc(100% - 5.9vw);
    }

    .project_activity .bg_box .right p{
        margin: 1.8vw 0 0;
    }

    .project_activity .bg_box .right p.f18{
        line-height: 4.0vw;
    }


    /* project_continue
       ================================================================== */
    .project_continue{
        padding: 6.0vw 0 0;
    }

    .project_continue .pc_flex{
        margin: 3.0vw 0 0;
        display: flex;
    }

    .project_continue .photo{
        margin: 0;
        width: 16.5vw;
        float: none;
    }

    .project_continue .text_box{
        padding: 2.4vw 0 0 3.5vw;
        width: calc(100% - 16.5vw);
        box-sizing: border-box;
    }


    /* project_support
       ================================================================== */
    .project_support{
        padding: 6.0vw 0 0;
    }

    .project_support .photo{
        margin: 3.0vw 0 0;
    }

    .project_support p{
        padding: 3.0vw 0 0;
    }


    /* project_search
       ================================================================== */
    .project_search{
        padding: 6.0vw 0 18.5vw;
    }

    .project_search .photo{
        margin: 4.0vw auto 0;
        width: 60.0vw;
    }

    .project_search .logo{
        margin: 2.5vw auto 0;
        width: 20.0vw;
    }

    .project_search .search{
        margin: .8vw auto 0;
        width: 35.0vw;
    }

    .project_search p{
        padding: 2.0vw 0 0;
        font-size: 2.0vw;
        line-height: 3.5vw;
    }
    
    
}
@media screen and (min-width : 1040px){


    /* template
       ================================================================== */
    .singlemother-project p{
        font-size: 16px;
        line-height: 28px;
    }

    .f18{
        font-size: 18px !important;
    }

    .f20{
        font-size: 20px !important;
    }

    .f23{
        font-size: 23px !important;
    }

    .f25{
        font-size: 25px !important;
    }

    .f28{
        font-size: 28px !important;
    }

    .f39{
        font-size: 39px !important;
    }
    

    /* border_title
       ================================================================== */
    .border_title{
        padding: 14px 0;
        font-size: 26px;
    }


    /* project_kv
       ================================================================== */
    .project_kv .photo{
        max-width: 1000px;
    }


    /* project_bg_wrap
       ================================================================== */
    .project_bg_wrap{
        padding: 0 0 130px;
    }

    .project_bg_wrap:before{
        height: calc(100% + 65px);
        top: -65px;
    }

    .project_bg_wrap .white_bg{
        padding: 0 50px;
    }


    /* project_counter
       ================================================================== */
    .project_counter{
        padding: 26px 0 0;
    }

    .project_counter .photo{
        margin: 0 auto;
    }

    .project_counter .logo{
        margin: 40px auto 0;
        width: 200px;
    }

    .project_counter .title{
        margin: 14px auto 0;
        font-size: 30px;
    }

    .project_counter .number_ttl{
        margin: 12px auto 0;
        text-align: center;
    }

    .project_counter .number_ttl > span{
        padding: 5px 33px;
        font-size: 20px;
    }

    .project_counter .number_text{
        margin: 0 auto 0;
    }

    .project_counter .number_text > span{
        padding: 0 5px 15px;
        font-size: 84px;
        background-size: auto 10px;
    }

    .project_counter .note{
        margin: 23px auto 0;
        font-size: 12px;
    }


    /* project_participate
       ================================================================== */
    .project_participate{
        padding: 70px 0 0;
    }

    .project_participate .list{
        margin: 45px auto 0;
    }

    .project_participate .list > li{
        margin: 25px auto 0;
        padding: 26px 26px 35px;
    }

    .project_participate .list .list_ttl .number{
        margin-right: 25px;
        padding: 0 0 6px;
        font-size: 50px;
        width: 80px;
        height: 80px;
    }

    .project_participate .list .list_ttl .siz_l{
        font-size: 50px;
    }

    .project_participate .list .list_ttl .siz_s{
        font-size: 38px;
    }

    .project_participate .list > li > *:not(.list_ttl){
        margin-left: 105px;
    }

    .project_participate .list p{
        margin: 10px 0 0;
        font-size: 18px;
    }

    .project_participate .list p + p{
        margin-top: 5px;
    }

    .project_participate .list .search{
        margin: 0 0 0;
        width: 350px;
    }

    .project_participate .list .btn{
        margin: 22px 0 0;
    }

    .project_participate .list .btn a{
        width: 335px;
        height: 60px;
    }

    .project_participate .list .btn a span{
        font-size: 23px;
    }

    .project_participate .list .btn a span img{
        margin-right: 16px;
        width: 35px;
    }

    .project_participate .list .item03{
        margin: 10px 0 0;
        width: 430px;
    }


    /* project_activity
       ================================================================== */
    .project_activity{
        padding: 60px 0 0;
    }

    .project_activity .photo{
        margin: 30px auto 0;
    }

    .project_activity .logo{
        margin: 30px auto 0;
        width: 200px;
    }

    .project_activity .text_box{
        margin: 50px auto 0;
        text-align: center;
    }

    .project_activity .text_box p{
        margin: 10px auto 0;
    }

    .project_activity .bg_box{
        margin: 30px auto 0;
        padding: 30px 25px 40px;
    }

    .project_activity .bg_box .icon{
        width: 59px;
    }

    .project_activity .bg_box .right{
        padding: 0 0 0 32px;
        width: calc(100% - 59px);
    }

    .project_activity .bg_box .right p{
        margin: 18px 0 0;
    }

    .project_activity .bg_box .right p.f18{
        line-height: 40px;
    }


    /* project_continue
       ================================================================== */
    .project_continue{
        padding: 60px 0 0;
    }

    .project_continue .pc_flex{
        margin: 30px 0 0;
        display: flex;
    }

    .project_continue .photo{
        margin: 0;
        width: 165px;
        float: none;
    }

    .project_continue .text_box{
        padding: 24px 0 0 35px;
        width: calc(100% - 165px);
        box-sizing: border-box;
    }


    /* project_support
       ================================================================== */
    .project_support{
        padding: 60px 0 0;
    }

    .project_support .photo{
        margin: 30px 0 0;
    }

    .project_support p{
        padding: 30px 0 0;
    }


    /* project_search
       ================================================================== */
    .project_search{
        padding: 60px 0 185px;
    }

    .project_search .photo{
        margin: 40px auto 0;
        width: 600px;
    }

    .project_search .logo{
        margin: 25px auto 0;
        width: 200px;
    }

    .project_search .search{
        margin: 8px auto 0;
        width: 350px;
    }

    .project_search p{
        padding: 20px 0 0;
        font-size: 20px;
        line-height: 35px;
    }
    
    
}