@charset "utf-8";
/* ===============
article header
================= */
.main {
    padding: 50px 0px 0px;
    background-image: url(../images/orenge_haikei.png);
    background-repeat: no-repeat;
    background-size: auto;
    background-position: left top;
}

.article__header {
    margin-top: 0px;
    position: relative;
}

.article__headerPC {
    display: none;
}

.work {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: center;
    margin: 50px auto 0;
}

.work::after {
    background-image: url(../images/company_dots.png);
    content: '';
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 160px;
    height: 8px;
    margin: 0 auto;
}
 
.article__headerSP img {
    border-radius: 20px;
    margin-top: 50px;
    padding: 0 4%;
}

.company_catch {
    margin: 25px auto;
    text-align: center;
}

.company_subtxt {
    font-family: "Zen Maru Gothic";
    font-size: 1rem;
    font-weight: 500;
    margin-top: 11px;
    text-align: center;
}

/* .article header pc */
@media screen and (min-width: 900px) {
    .main {
        padding: 80px 9.7% 80px;
        /* background-color: var(--primary-orange); */
        background-image: url(../images/orenge_haikei_pc.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: left -10px top;
    }
    
    .article__header {
        margin-top: 0px;
        position: relative;
    }
    
    .article__headerSP {
        display: none;
    }

    .article__headerPC {
        display: block;
    }

    .work {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2.5rem;
        font-weight: 700;
        text-align: center;
        margin: 80px auto 0;
    }
    
    .work::after {
        background-image: url(../images/pc_dots_orange.png);
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        width: 218px;
        height: 8px;
        margin: 0 auto;
    }
    
    .article__header img {
        border-radius: 20px;
        margin: 46px 0 0 30px;
    }
    
    .company_catch {
        margin: 50px auto;
        text-align: center;
    }

    .company_catch img {
        display: block;
        width: 263px;
        /* text-align: center; */
        margin: 0 auto;
        justify-content: center;
    }
    
    .company_subtxt {
        font-family: "Zen Maru Gothic";
        font-size: 1rem;
        font-weight: 500;
        margin-top: 11px;
        text-align: center;
    }
}
/* pc 900px */

/* ===============
rinen
================= */
.rinen__content {
    position: relative;
}

.work__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: left;
    line-height: 1.5;
    margin: 50px 4% 0;
    padding: 0 4%;
    width: max-content;
    padding: 0 14px;
    background: transparent;
    border-left: solid 10px #FFDBB7;
}

.rinen__box img {
    display: none; 
}

.work__rinen {
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    margin-top: 25px;
}

.work__txt,
.work__txtY {
    font-size: 1rem;
    line-height: 2; 
    padding: 0 4%;
    margin: 25px auto 0;
}

.company_imgPC {
    display: none;
}

.rinen__content::after {
    background-image: url(../images/company_fam.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 178px;
    height: 145px;
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    bottom: -186px;
    transform: translateX(-50%);
}

/* .rinen pc */
@media screen and (min-width: 900px) {
    .work__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: left;
        line-height: 1.5;
        margin: 80px 4% 0;
        padding: 0 4%;
        width: max-content;
        padding: 0 14px;
        background: transparent;
        border-left: solid 10px #FFDBB7;
    }
    
    .rinen__box img {
        display: block;
    }
    
    .work__rinen {
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.1;
        text-align: left;
        margin-top: 34px;
        margin-left: 115px;
    }
    
    .work__txt {
        font-size: 1.1rem;
        line-height: 2;
        text-align: left;
        /* width: 377px; */
        margin-left: 26px;
    }

    .work__txtY {
        font-size: 1.1rem;
        line-height: 2;
        margin: 25px 0px 0 35px;
        padding: 0 49px;
        text-align: left;
        width: 468px;
        position: relative;
    }
    
    .rinen__box {
        display: flex;
        justify-content: space-around;
        flex-direction: row;
    }

    .rinen__box img {
        border-radius: 20px;
        flex-basis: 40.7%;
        max-width: 40.7%;
    }

    .rinen__smallbox {
        display: block;
        flex-basis: 50%;
    }

    .company_imgPC {
        display: none;
    }
    
    .rinen__content::after {
        background-image: url(../images/company_fam.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 372px;
        height: 305px;
        display: block;
        content: "";
        position: absolute;
        left: 50%;
        bottom: -9px;
        transform: translateX(22%);
    }
}
/* pc 900px */



/* ===============
housin
================= */
.section--housin {
    padding: 196px 4% 0px;
    position: relative;
}

.housin__list {
    margin-top: 30px;
}

.housin__item, 
.housin__item2,
.housin__item3,
.housin__item4,
.housin__item5,
.housin__item6 {
    margin-top: 22px;
    display: flex;
    gap: 50px;
}

.housin__no {
    color: #FFDBB7;
    font-family: Inter;
    font-size: 50px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

/* .housin pc */
@media screen and (min-width: 900px) {
    .section--housin {
        padding: 50px 0px 0px;
        position: relative;
    }
    
    .housin__list {
        margin-top: 35px;
        display: flex;
        flex-wrap: wrap;
        margin: 0 auto;
        margin-top: 30px;
    }
    
    .housin__item, 
    .housin__item2,
    .housin__item3,
    .housin__item4,
    .housin__item5,
    .housin__item6 {
        margin-top: 22px;
        display: flex;
        gap: 0px;
        flex-basis: 275px;
        flex-direction: row;
        margin-left: 100px;
        z-index: 10;
        position: relative;
    }

    .housin__item::after {
        content: '';
        display: block;
        background-image: url(../images/housin01.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 108px;
        height: 182px;
        left: 73px;
        bottom: -62px;
        position: absolute;
    }

    .housin__item2::after {
        content: '';
        display: block;
        background-image: url(../images/housin02.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 108px;
        height: 182px;
        left: 73px;
        bottom: -62px;
        position: absolute;
    }

    .housin__item3::after {
        content: '';
        display: block;
        background-image: url(../images/housin03.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 108px;
        height: 182px;
        left: 73px;
        bottom: -62px;
        position: absolute;
    }

    .housin__item4::after {
        content: '';
        display: block;
        background-image: url(../images/housin04.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 108px;
        height: 182px;
        left: 73px;
        bottom: -62px;
        position: absolute;
    }

    .housin__item5::after {
        content: '';
        display: block;
        background-image: url(../images/housin05.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 108px;
        height: 182px;
        left: 73px;
        bottom: -62px;
        position: absolute;
    }

    .housin__item6::after {
        content: '';
        display: block;
        background-image: url(../images/housin06.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 108px;
        height: 182px;
        left: 73px;
        bottom: -62px;
        position: absolute;
    }

    .housin__no {
        display: none;
    }
    

}
/* ===============
gaiyou
================= */
.section--gaiyou {
    padding: 0 4%;
}

.flow__title {
   color: var(--primary-black);
   font-family: "Zen Maru Gothic";
   font-size: 1.62rem;
   font-weight: 700;
   text-align: left;
   line-height: 1.5;
   margin: 50px 4% 35px;
   padding: 0 4%;
   width: max-content;
   padding: 0 14px;
   background: transparent;
   border-left: solid 10px #FFDBB7;
}

.flow__listSP {
    margin: 25px auto;
    text-align: center;
}

.flow__listPC {
    display: none;
}

.flow__time {
    color: #4F4844;
    font-family: Inter;
    font-size: 1rem;
    width: 375px;
    height: 72px;
    background-color: #FFFCEB;
    border-radius: 0;
    text-align: left;
    padding: 25px 41px;
}

.flow__timeYellow {
    color: #4F4844;
    font-family: Inter;
    font-size: 1rem;
    width: 375px;
    height: 72px;
    background-color: #ffffff;
    border-radius: 0;
    text-align: left;
    padding: 25px 41px;
}

.flow__timeYellow span {
    margin-left:116px;
    font-family: "Noto Sans JP";
    font-size: 1.1rem;
    font-weight: 400;
    position: relative;
}

.flow__timePink {
    color: #4F4844;
    font-family: Inter;
    font-size: 1.1rem;
    font-weight: 700;
    width: 375px;
    height: 96px;
    text-align: left;
    padding: 30px 30px;
    background-color:rgba(255, 184, 219, 0.15);
}

.flow__timePink span {
    margin-left:107px;
    font-family: "Noto Sans JP";
    font-size: 1.1rem;
    font-weight: 400;
    position: relative;
}

.flow__timeYellow:last-of-type {
    border-radius: 0 0 20px 20px;
}

.flow__icon img {
    width: 20px;
    height: 20px;
    margin: 7px 10px;
}

.company__saniwa {
    border-bottom: 1px solid #4F4844;
}

/* .gaiyou pc */
@media screen and (min-width: 900px) {
    .section--gaiyou {
        padding: 0;
    }
    
    .flow__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: left;
        line-height: 1.5;
        margin: 80px 4% 0;
        padding: 0 4%;
        width: max-content;
        padding: 0 14px;
        background: transparent;
        border-left: solid 10px #FFDBB7;
    }
    
    .flow__listSP {
        display: none;
    }
    
    .flow__listPC {
        display: block;
        margin: 25px auto;
        text-align: center;
        max-width: max-content;
    }


    .flow__time {
        color: #4F4844;
        font-family: Inter;
        font-size: 1rem;
        width: 375px;
        height: 72px;
        background-color: #FFFCEB;
        border-radius: 0;
        text-align: left;
        padding: 25px 41px;
    }


    .flow__time2 {
        color: #4F4844;
        font-family: Inter;
        font-size: 1rem;
        width: 375px;
        height: 72px;
        background-color: rgba(255, 219, 183, 0.30);
        border-radius: 0;
        text-align: left;
        padding: 25px 41px;
    }
    
    .flow__timeYellow {
        color: #4F4844;
        font-family: Inter;
        font-size: 1rem;
        width: 375px;
        height: 72px;
        background-color: #FFFCEB;
        border-radius: 0;
        text-align: left;
        padding: 25px 41px;
    }

    .flow__timeYellow2 {
        color: #4F4844;
        font-family: Inter;
        font-size: 1rem;
        width: 375px;
        height: 72px;
        /* background-color:#ffffff; */
        background-color: rgba(255, 219, 183, 0.30); 
        border-radius: 0;
        text-align: left;
        padding: 25px 41px;
    }
    
    .flow__timeYellow span {
        margin-left:116px;
        font-family: "Noto Sans JP";
        font-size: 1.1rem;
        font-weight: 400;
        position: relative;
    }
}
/* pc 900px */


/* ===============
access
================= */
.section--access {
    padding: 0 4%;
}

.access__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: left;
    line-height: 1.5;
    margin: 25px 4% 5px;
    padding: 0 4%;
    width: max-content;
    padding: 0 14px;
    background: transparent;
    border-left: solid 10px #FFDBB7;
}

.section--access img {
    height: 300px;
}

.access__txt {
    font-size: 1rem;
    line-height: 2; 
    margin-top: 25px; 
}

.access__mapImg {
    display: flex;
    margin-top: 22px;
    
}

.access__mapImg img {
    width: 20px;
    height: 20px;
    width: 20px;
    height: 20px;
    margin: 6px 0 170px;
}

.access__txt2 {
    font-size: 1rem;
    line-height: 2; 
    position: relative;
}

.access__txt2::after {
    background-image: url(../images/company_map_wc.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 89px;
    height: 103px;
    display: block;
    content: "";
    position: absolute;
    right: -74%;
    top: 41px;
}

/* .access pc */
@media screen and (min-width: 900px) {
    .section--access {
        padding: 0;
    }
    
    .access__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: left;
        line-height: 1.5;
        margin: 80px 4% 0;
        padding: 0 4%;
        width: max-content;
        padding: 0 14px;
        background: transparent;
        border-left: solid 10px #FFDBB7;
    }

    .access__box {
        display: flex;
        justify-content: space-evenly;
    }

    .access__boxB {
        display: block;
    }


    .section--access img {
        height: auto;
        width: 472px;
    }
    
    .access__txt {
        font-size: 1.1rem;
        line-height: 1.5;
        width: 334px;
    }
    
    .access__mapImg {
        display: flex;
        margin-top: 22px;
        
    }
    
    .access__mapImg img {
        width: 20px;
        height: 20px;
        width: 20px;
        height: 20px;
        margin: 6px 0 170px;
    }
    
    .access__txt2 {
        font-size: 1.1rem;
        line-height: 1.5;
        position: relative;
        margin-left: 7px;
    }
    
    .access__txt2::after {
        background-image: url(../images/company_map_wc.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 129px;
        height: 149px;
        display: block;
        content: "";
        position: absolute;
        right: -70%;
        top: 39px;
    }
}