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

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

.work__all {
    font-family: "Zen Maru Gothic";
    font-size: 1rem;
    font-weight: 700;
    line-height: 2;
    margin: 30px 0 0 11%;
}

.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/work3_dots.png);
    content: '';
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 293px;
    height: 8px;
    margin: 0 auto;
}

.workTopics {
    margin-top: 46px;
    text-align: right;
    
}

.workTopics img {
    border-radius: 20px;
    /* margin: 0px 0 0 30px; */
    /* max-width: 345px; */
}

.work__title::after {
    background-image: url(../images/work3_rogo.png);
    content: '';
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100px;
    height: 100px;
    position: absolute;
    left: 50%;
    bottom: 50%;
    top: 0;
    transform: translate(-50%,-100%);
}

.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: 120px auto 0;
    padding: 0 4%;
    width: max-content;
    position: relative;
}

.orange {
    color: #FDA923;
}

/* .article header pc */
@media screen and (min-width: 900px) {
    .nav__item2 a{
        text-align: center;
        font-size: 1rem;
        display: flex; 
        flex-direction: column; 
        margin-top: 0px;
        padding-right: 0px;
        border-bottom: none;
        color: #FDA923;
    }

    .nav__item3 a{
        color: #4F4844;
    }

    .nav__item3 a:hover {
        color: #FDA923;
    }
    
    .main {
        padding: 80px 9% 0px;
        background-image: url(../images/pink_haikei_pc.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: left -10px top;
    }
    
    .article__header {
        margin-top: 0px;
        position: relative;
    }
    
    .work__all {
        font-family: "Zen Maru Gothic";
        font-size: 1.1rem;
        font-weight: 700;
        line-height: 2;
        margin: 25px 0 0 0;
    }

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

    .work::after {
        background-image: url(../images/work3_dots_pc.png);
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        width: 734px;
        height: 8px;
        margin: 0 auto;
    }
    
    .workTopics {
        margin-top: 46px;
        text-align: right;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: flex-start;
        flex-wrap: wrap;
    }
    
    .workTopics img {
        border-radius: 20px;
        /* margin: 0px 0 0 30px; */
        width: 473px;
    }
    
    .work__title::after {
        background-image: url(../images/work3_rogo.png);
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        width: 113px;
        height: 113px;
    }
    
    .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: 140px 0 0 40px;
        padding: 0 4%;
        width: max-content;
    }
    
    .orange {
        color: #FDA923;
    }
}
/* pc 900px */


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

.work3__orange {
    background-image: radial-gradient(circle at center, #FDA923, transparent 20%); /* 点の色とサイズ調整 */
    background-position: top right; /* 点の位置 */
    background-repeat: repeat-x; /* 横方向に繰り返し */
    background-size: 1em 0.3em; /* 点の間隔とサイズ調整 */
    padding-top: 1px; /* 縦方向の位置調整 */
    color: #FDA923;
}

.work__Secondtitle {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: left;
    line-height: 1.5;
    margin: 0 auto;
    padding: 0 4%;
    width: max-content;
}

.work__txt {
    font-family: "Noto Sans JP";
    font-size: 1rem;
    line-height: 2; 
    text-align: left;
    margin: 25px auto 0;
    padding: 0 4%;
} 

.work__txt span {
    font-weight: 400;
    border-bottom: 2px solid #FDA923;
}

.work3__dan {
    margin-top: 25px;
    font-family: "Noto Sans JP";
    font-size: 1rem;
    line-height: 2; 
    text-align: left;
    margin: 25px auto 0;
    padding: 0 4%;
}

.section--topics img {
    border-radius: 20px;
    margin: 25px auto 0;
    text-align: center;
}

/* .topics pc */
@media screen and (min-width: 900px) {
    .section--topics {
        padding: 80px 34px 0px;
        position: relative;
        display: flex;
        align-content: space-between;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .topics__title {
        width: 472px;
    }

    .work3__orange {
        background-image: radial-gradient(circle at center, #FDA923, transparent 20%); /* 点の色とサイズ調整 */
        background-position: top right; /* 点の位置 */
        background-repeat: repeat-x; /* 横方向に繰り返し */
        background-size: 1em 0.3em; /* 点の間隔とサイズ調整 */
        padding-top: 1px; /* 縦方向の位置調整 */
        color: #FDA923;
    }
    
    .work__Secondtitle {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: left;
        line-height: 1.5;
        margin: 0 auto;
        padding: 0;
        width: max-content;
    }

    .work__Secondtitle br {
        display: none;
    }
    
    .work__txt {
        font-family: "Noto Sans JP";
        font-size: 1.1rem;
        line-height: 2; 
        text-align: left;
        margin: 25px auto 0;
        padding: 0 4%;
    } 
    
    .work__txt span {
        font-weight: 600;
        border-bottom: 2px solid #FDA923;
    }
    
    .work3__dan {
        margin-top: 25px;
        font-family: "Noto Sans JP";
        font-size: 1rem;
        line-height: 2; 
        text-align: left;
        margin: 25px auto 0;
        padding: 0 4%;
    }
    
    .section--topics img {
        width: 473px;
        height: 238px;
        border-radius: 20px;
        margin: 15px 0 0 21px;
        text-align: center;
    }
}
/* pc 900px */


/* ===============
service
================= */
.section--service {
    padding: 50px 4% 0px;
}

.service__sheet {
    border-radius: 20px;
    background-color: #FFFCEB;
    padding: 37px 22px 28px;
    position: relative;
    margin-top: 46px;
}

.service__sheet2 {
    border-radius: 20px;
    background-color: #FFFCEB;
    padding: 37px 22px 28px;
    position: relative;
    margin-top: 46px;
}

.service__sheet3,
.service__sheet4,
.service__sheet5,
.service__sheet6 {
    border-radius: 20px;
    background-color: #FFFCEB;
    padding: 37px 22px 28px;
    position: relative;
    margin-top: 46px;
}

.service__sheet::before {
    left: 0px;
    top: -38px;
    display: block;
    content: "";
    background-image: url(../images/work3_1.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 79px;
    height: 79px;
    position: absolute;
    background-position: left 0px, top 20px;
}

.service__sheet2::before {
    left: 0px;
    top: -38px;
    display: block;
    content: "";
    background-image: url(../images/work3_2.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 79px;
    height: 79px;
    position: absolute;
    background-position: left 0px, top 20px;
}

.service__sheet3::before {
    left: 0px;
    top: -38px;
    display: block;
    content: "";
    background-image: url(../images/work3_3.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 79px;
    height: 79px;
    position: absolute;
    background-position: left 0px, top 20px;
}
.service__sheet4::before {
    left: 0px;
    top: -38px;
    display: block;
    content: "";
    background-image: url(../images/work3_4.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 79px;
    height: 79px;
    position: absolute;
    background-position: left 0px, top 20px;
}

.service__sheet5::before {
    left: 0px;
    top: -38px;
    display: block;
    content: "";
    background-image: url(../images/work3_5.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 79px;
    height: 79px;
    position: absolute;
    background-position: left 0px, top 20px;
}

.service__sheet6::before {
    left: 0px;
    top: -38px;
    display: block;
    content: "";
    background-image: url(../images/work3_6.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 79px;
    height: 79px;
    position: absolute;
    background-position: left 0px, top 20px;
}

.service__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.5;
    margin: 0 auto 0;
    padding: 0 4%;
    width: max-content;
}

.service__Sitem {
    font-family: "Noto Sans JP";
    font-size: 1rem;
    line-height: 2;
    margin-top: 15px;
}

.service__item:first-of-type {
    margin-top: 0px;
}

.service__list {
    color: #4F4844;
    font-family: "Noto Sans JP";
    font-size: 1.62rem;
    font-weight: 500;
    line-height: normal;
    text-align: center;
}

.service__subtitle {
    font-size: 1.1rem;
    line-height: 2; 
    margin-top: 24px;
}

.service__naiyou img {
    margin-top: 25px;
    width: 100%;
}

.service__txt {
    font-family: "Noto Sans JP";
    font-size: 1rem;
    line-height: 2;
    margin-top: 157px;
}

.service__list2,
.service__list3  {
    color: #4F4844;
    font-family: "Noto Sans JP";
    font-size: 1.62rem;
    font-weight: 500;
    line-height: normal;
    text-align: center;
}

.service__list2::after {
    background-image: url(../images/work2_2.png);
    content: '';
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 207px;
    height: 159px;
    position: absolute;
    left: 25%;
    bottom: 39px;
}

.service__setumei {
    color: #4F4844;
    font-family: "Noto Sans JP";
    font-size: 1.62rem;
    margin-top: 25px;
}

.service__setumeiS {
    font-size: 1.1rempx;
    margin-top: 12px;
}

.service__list3::after {
    background-image: url(../images/work2_3.png);
    content: '';
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    width: 261px;
    height: 185px;
    position: absolute;
    left: 15%;
    bottom: 39px;
}

.service__txt:last-of-type {
    margin-top: 25px;
    padding: 0 4%;
}

/* .service pc */
@media screen and (min-width: 900px) {
    .section--service {
        padding: 80px 0px;
    }
    
    .service__all {
        display: flex;
        gap: 55px;
        margin-top: 40px;
        flex-basis: 337px;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .service__sheet_all {
        flex-basis: 350px;
    }

    .service__sheet {
        border-radius: 20px;
        background-color: #FFFCEB;
        padding: 37px 22px 28px;
        position: relative;
        margin-top: 46px;
        
    }
    
    .service__sheet2 {
        border-radius: 20px;
        background-color: #FFFCEB;
        padding: 37px 22px 28px;
        position: relative;
        margin-top: 46px;
    }
    
    .service__sheet3,
    .service__sheet4,
    .service__sheet5,
    .service__sheet6 {
        border-radius: 20px;
        background-color: #FFFCEB;
        padding: 37px 22px 28px;
        position: relative;
        margin-top: 46px;
    }

    .service__sheet4 {
        border-radius: 20px;
        background-color: #FFFCEB;
        padding: 37px 22px 28px;
        position: relative;
        margin-top: 46px;
    }
    
    .service__sheet::before {
        left: 0px;
        top: -38px;
        display: block;
        content: "";
        background-image: url(../images/work3_1.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 79px;
        height: 79px;
        position: absolute;
        background-position: left 0px, top 20px;
    }
    
    .service__sheet2::before {
        left: 0px;
        top: -38px;
        display: block;
        content: "";
        background-image: url(../images/work3_2.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 79px;
        height: 79px;
        position: absolute;
        background-position: left 0px, top 20px;
    }
    
    .service__sheet3::before {
        left: 0px;
        top: -38px;
        display: block;
        content: "";
        background-image: url(../images/work3_3.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 79px;
        height: 79px;
        position: absolute;
        background-position: left 0px, top 20px;
    }
    .service__sheet4::before {
        left: 0px;
        top: -38px;
        display: block;
        content: "";
        background-image: url(../images/work3_4.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 79px;
        height: 79px;
        position: absolute;
        background-position: left 0px, top 20px;
    }
    
    .service__sheet5::before {
        left: 0px;
        top: -38px;
        display: block;
        content: "";
        background-image: url(../images/work3_5.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 79px;
        height: 79px;
        position: absolute;
        background-position: left 0px, top 20px;
    }
    
    .service__sheet6::before {
        left: 0px;
        top: -38px;
        display: block;
        content: "";
        background-image: url(../images/work3_6.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 79px;
        height: 79px;
        position: absolute;
        background-position: left 0px, top 20px;
    }
    
    .service2__img {
        padding-top: 33px;
    }

    .service4__img {
        padding-top: 109px;
    }

    .service5__img {
        padding-top: 23px;
    }
    .service__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        line-height: 1.5;
        margin: 0 auto 0;
        padding: 0 4%;
        width: max-content;
    }
    
    .service__Sitem {
        font-family: "Noto Sans JP";
        font-size: 1rem;
        line-height: 2;
        margin-top: 15px;
    }
    
    .service__item:first-of-type {
        margin-top: 0px;
    }
    
    .service__list {
        color: #4F4844;
        font-family: "Noto Sans JP";
        font-size: 1.62rem;
        font-weight: 500;
        line-height: normal;
        text-align: center;
    }
    
    .service__subtitle {
        font-size: 1.1rem;
        line-height: 2; 
        margin-top: 24px;
        text-align: left;
    }
    
    .service__naiyou img {
        margin-top: 25px;
    }
    
    .service__txt {
        font-family: "Noto Sans JP";
        font-size: 1rem;
        line-height: 2;
        margin-top: 157px;
    }
    
    .service__list2,
    .service__list3  {
        color: #4F4844;
        font-family: "Noto Sans JP";
        font-size: 1.62rem;
        font-weight: 500;
        line-height: normal;
        text-align: center;
    }
    
    .service__list2::after {
        background-image: url(../images/work2_2.png);
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        width: 207px;
        height: 159px;
        position: absolute;
        left: 25%;
        bottom: 39px;
    }
    
    .service__setumei {
        color: #4F4844;
        font-family: "Noto Sans JP";
        font-size: 1.62rem;
        margin-top: 25px;
    }
    
    .service__setumeiS {
        font-size: 1.1rempx;
        margin-top: 12px;
    }
    
    .service__list3::after {
        background-image: url(../images/work2_3.png);
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        width: 261px;
        height: 185px;
        position: absolute;
        left: 15%;
        bottom: 39px;
    }
    
    .service__txt:last-of-type {
        margin-top: 25px;
        padding: 0 4%;
    }
}
/* pc 900px */


/* ===============
flow
================= */
.section--flow {
    padding: 50px 0px 0px;
}

.flow__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.5;
    margin: 0 auto 0;
    padding: 0 4%;
    width: max-content;
    position: relative;
}

.flow__title::before {
    display: block;
    content: "";
    background-image: url(../images/work3_asirai_1.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 47px;
    height: 34px;
    left: -40px;
    top: -20px;
    position: absolute;
}

.flow__title::after {
    display: block;
    content: "";
    background-image: url(../images/work3_asirai_2.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 47px;
    height: 34px;
    right: -40px;
    top: -20px;
    position: absolute;
}

.flow__list {
    margin: 25px auto;
}

.flow__plan .flow__time {
    color: #4F4844;
    font-family: Inter;
    font-size: 1.1rem;
    font-weight: 700;
    width: 375px;
    height: 96px;
    background-color: rgba(255, 184, 219, 0.15);
    border-radius: 0;
    text-align: center;
    padding: 30px 0;
    display: flex;
}


.flow__start {
    min-width: 100px;
    position: relative;
}

.flow__start::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #4F4844;
    position: absolute;
    /* left: calc(-2em - 6px); */
    transform: translate(600%);
    top: 8px;
    left: -18px;
    display: block;
}

.flow__start::after {
    content: "";
    border-bottom: 1px solid;
    background-color: #4F4844;
    position: absolute;
    width: 3px;
    height: 96px;
    left: 97px;
    top: -30px;
}

.flow__plan:first-of-type .flow__start::after {
    height: 48px;
    top: 20px;
}

.flow__plan:last-of-type .flow__start::after {
    height: 48px;
}

.flow__plan:first-of-type .flow__time {
    border-radius: 20px 20px 0 0;
}

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

.flow__reku {
    font-family: "Noto Sans JP";
    font-size: 1.1rem;
    font-weight: 400;
    padding-left: 30px;
}

.flow__plan:nth-child(even) .flow__time{
    background-color: #FFFCEB;
}

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

.flow__timeYellowE {
    color: #4F4844;
    font-family: Inter;
    font-size: 1.1rem;
    font-weight: 700;
    width: 375px;
    height: 96px;
    text-align: left;
    padding: 30px 30px;
    background-color: #FFFCEB;
    border-radius: 0px 0px 20px 20px;
}



.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 span::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #4F4844;
    position: absolute;
    /* left: calc(-2em - 6px); */
    transform: translate(550%);
    top: 5px;
    display: block;
}

.flow__timeYellowE span::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #4F4844;
    position: absolute;
    /* left: calc(-2em - 6px); */
    transform: translate(550%);
    top: 5px;
    display: block;
}

.flow__timePink span::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #4F4844;
    position: absolute;
    /* left: calc(-2em - 6px); */
    transform: translate(550%);
    top: 5px;
    display: block;
}

.work3_img {
    padding: 25px 4% 0;
}

.work3_img img {
    border-radius: 20px;
    margin-top: 25px;
}

/* .flow pc */
@media screen and (min-width: 900px) {
    .section--flow {
        padding: 80px 0px;
    }
    
    .flow__all {
        display: flex;
        margin-top: 50px;
        justify-content: center;
        gap: 70px;
    }

    .flow__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        line-height: 1.5;
        margin: 0 auto 0;
        padding: 0 4%;
        width: max-content;
    }
    
    .flow__title::before {
        display: block;
        content: "";
        background-image: url(../images/work3_asirai_1.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        width: 47px;
        height: 34px;
        left: -40px;
        top: -20px;
        position: absolute;
    }
    
    .flow__title::after {
        display: block;
        content: "";
        background-image: url(../images/work3_asirai_2.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        width: 47px;
        height: 34px;
        right: -40px;
        top: -20px;
        position: absolute;
    }
    
    
    
    
    .flow__list {
        margin: 25px 0 0;
        max-width: 375px;
    }
    
    .flow__time {
        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);
        border-radius: 20px 20px 0 0;
        position: relative;
    }
    
    .flow__timeYellow {
        color: #4F4844;
        font-family: Inter;
        font-size: 1.1rem;
        font-weight: 700;
        width: 375px;
        height: 96px;
        text-align: left;
        padding: 30px 30px;
        background-color: #FFFCEB;
    }
    
    .flow__timeYellow span {
        margin-left: 109px;
        font-family: "Noto Sans JP";
        font-size: 1.1rem;
        font-weight: 400;
        position: relative;
    }
    
    .flow__timeYellowE {
        color: #4F4844;
        font-family: Inter;
        font-size: 1.1rem;
        font-weight: 700;
        width: 375px;
        height: 96px;
        text-align: left;
        padding: 30px 30px;
        background-color: #FFFCEB;
        border-radius: 0px 0px 20px 20px;
    }
    
    .flow__timeYellowE span {
        margin-left: 109px;
        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__time span::before {
        content: "";
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #4F4844;
        transform: translate(550%);
        top: 5px;
    }
    
    .flow__time span::after {
        content: "";
        border-bottom: 1px solid;
        background-color: #4F4844;
        position: absolute;
        width: 3px;
        height: 1060px;
        left: -31%;
        top: 20px;
    }
    
    .flow__timeYellow span::before {
        content: "";
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #4F4844;
        position: absolute;
        /* left: calc(-2em - 6px); */
        transform: translate(550%);
        top: 5px;
        display: block;
    }
    
    .flow__timeYellowE span::before {
        content: "";
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #4F4844;
        position: absolute;
        /* left: calc(-2em - 6px); */
        transform: translate(550%);
        top: 5px;
        display: block;
    }
    
    .flow__timePink span::before {
        content: "";
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #4F4844;
        position: absolute;
        /* left: calc(-2em - 6px); */
        transform: translate(550%);
        top: 5px;
        display: block;
    }
    
    .work3_img {
        padding: 25px 4% 0;
        width: 375px;
        margin-top: 60px;
    }
    
    .work3_img img {
        border-radius: 20px;
        margin-top: 25px;
    }

    .work3_img_2 {
        margin-left: 57px;
    }
}
/* pc 900px */


/* ===============
open
================= */
.section--open {
    padding: 50px 4% 0px;
}

.open__sheet {
    border-radius: 20px;
    background-color: rgba(250, 214, 231, 0.50);
    padding: 18px 60px;
    border-radius: 20px;
}

.open__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.5;
    margin: 0 auto 0;
    padding: 0 4%;
    width: max-content;
}

.open__list {
    margin-top: 25px;
}

.open__item {
    font-size: 1rem;
    margin-top: 16px;
}   

/* .open pc */
@media screen and (min-width: 900px) {
    .section--open {
        padding: 0;
    }
    
    .open__sheet {
        border-radius: 20px;
        background-color: rgba(250, 214, 231, 0.50);
        padding: 41px 32px 40px;
        width: 567px;
        border-radius: 20px;
    }
    
    .open__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        margin: 0;
        width: max-content;
    }
    
    .open__list {
        margin-top: 28px;
        margin-left: 42px;
    }
    
    .open__item {
        font-size: 1.1rem;
        margin-top: 16px;
    }

    .open__item p {
        margin-left: 178px;
    } 

    .brSP {
       display: none;
    }   

    .open__box {
        display: flex;
        padding: 0;
        justify-content: center;
        flex-wrap: wrap;
        gap: 22px;
        margin-bottom: 80px;
    }
}
/* pc 900px*/


/* ===============
place
================= */
.section--place {
    padding: 50px 4% 0;
}

.place__sheet {
    border-radius: 20px;
    background-color: rgba(250, 214, 231, 0.50);
    padding: 18px 60px;
}

.place__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.5;
    margin: 0 auto 0;
    padding: 0 4%;
    width: max-content;
}

.place__list {
    margin-top: 25px;
    position: relative;
  
}

.place__item {
    font-size: 1rem;
    margin: 16px auto 0;
    text-align: left;
    
}  

.place__item:last-of-type {
    margin: 159px auto 0;
    text-align: center;
}   

.place__list::after {
    display: block;
    content: "";
    background-image: url(../images/work3_car.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 120px;
    height: 80px;
    left: 50%;
    bottom: 106px;
    position: absolute;
    transform: translateX(-50%);
}

/* .place pc */
@media screen and (min-width: 900px) {
    .section--place {
        padding: 0px;
    }
    
    .place__sheet {
        border-radius: 20px;
        background-color: rgba(250, 214, 231, 0.50);
        padding: 41px 73px 41px 37px;
        width: 345px;
        height: 411px;
    }
    
    .place__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: left;
        line-height: 1.5;
        margin: 0;
        padding: 0;
        width: max-content;
    }
    
    .place__list {
        margin-top: 20px;
        position: relative;
    }
    
    .place__item {
        font-size: 1.1rem;
        margin: 16px 0 0 38px;
        text-align: left;
        width: max-content;
    }  
    
    .place__item:last-of-type {
        margin: 159px auto 0;
        text-align: left;
        padding-left: 20px;
    }   
    
    .place__list::after {
        display: block;
        content: "";
        background-image: url(../images/work3_car.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        width: 200px;
        height: 133px;
        left: 53%;
        bottom: 106px;
        position: absolute;
    } 
}

/* ===============
other
================= */
.section--other {
    padding: 50px 4%;
}


.other__title {
    color: var(--primary-black);
    font-family: "Zen Maru Gothic";
    font-size: 1.62rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.5;
    margin: 0 auto 0;
    padding: 0 4%;
    width: max-content;
}

.other__title::after {
    background-image: url(../images/pc_dots_orange.png);
    content: '';
    display: block;
    background-repeat: no-repeat;
    background-size: cover;
    width: 160px;
    height: 8px;
    margin: 0 auto;
}

.other__list {
    margin-top: 30px;
}


.other__img {
    width: 300px;
    margin: 8px auto;
}

.btn_n2 {
    display: block;
    content: '';
    width: 345px;
    height: 69px;
    padding: 5px 13px; 
    border-radius: 50px;
    background: var(--primary-blue);
    /* border: 3px solid #E8F9D2 ; */
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25 );
    color: var(--primary-black);
    font-size: 1.8rem;
    font-family: "Zen Maru Gothic";
    text-align: center;
    margin: 0px auto;
    position: relative;
} 

.btn_n2::after {
    content: '';
    display: block;
    width: 7px;
    height: 14px;
    background-image: url(../images/about2_arrow.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    right: 20px; 
    top: 50%; 
    transform: translateY(-50%) 
}

.btn_n1 {
    display: block;
    content: '';
    width: 345px;
    height: 69px;
    padding: 5px 13px; 
    border-radius: 50px;
    background: var(--primary-green);
    /* border: 3px solid #E8F9D2 ; */
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25 );
    color: var(--primary-black);
    font-size: 1.8rem;
    font-family: "Zen Maru Gothic";
    text-align: center;
    margin: 50px auto;
    position: relative;
} 

.btn_n1::after {
    content: '';
    display: block;
    width: 7px;
    height: 14px;
    background-image: url(../images/about2_arrow.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    right: 50px; 
    top: 50%; 
    transform: translateY(-50%) 
}

/* .other pc */
@media screen and (min-width: 900px) {
    .section--other {
        padding: 0px 0px 80px;
    }
    
    
    .other__title {
        color: var(--primary-black);
        font-family: "Zen Maru Gothic";
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        line-height: 1.5;
        padding: 0;
        width: max-content;
    }
    
    .other__title::after {
        background-image: url(../images/pc_dots_orange.png);
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: cover;
        width: 160px;
        height: 8px;
        margin: 0 auto;
    }
    
    .other__list {
        margin-top: 50px;
        display: flex;
        justify-content: space-evenly;
    }
    
    
    .other__img {
        width: 300px;
        margin: 8px auto;
    }
    
    .btn_n1 {
        display: block;
        content: '';
        width: 345px;
        height: 69px;
        padding: 5px 13px;
        border-radius: 50px;
        background: var(--primary-green);
        /* border: 3px solid #E8F9D2; */
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25 );
        color: var(--primary-black);
        font-size: 1.8rem;
        font-family: "Zen Maru Gothic";
        text-align: center;
        position: relative;
        margin-top: 0px;
    } 
    
    .btn_n1::after {
        content: '';
        display: block;
        width: 7px;
        height: 14px;
        background-image: url(../images/about2_arrow.svg);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        position: absolute;
        right: 50px; 
        top: 50%; 
        transform: translateY(-50%) 
    }
    
    .btn_n2 {
        margin: 0px auto 0;
        position: relative;
    } 
    
    .btn_n2::after {
        content: '';
        display: block;
        width: 7px;
        height: 14px;
        background-image: url(../images/about2_arrow.svg);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        position: absolute;
        right: 22px;
        top: 52%;
        transform: translateY(-50%);
    }
}