#dogrun-container {
    display          : flex;
    flex-direction   : column;
    /* align-items   : center; */
}

#dogpark-title-wrap {
    /* max-width      : 80%; */
    display        : flex;
    flex-direction : row;
    align-items    : center;
    justify-content: space-between;
    margin         : 5% auto;
}


#shibainu-red-pool {
    width: 6em;
}

#runnningshiba-black {
    height: 6em;
}

#dogpark-title-wrap div {
    margin             : 0 2em;
    display            : flex;
    flex-direction     : column;
    align-items        : center;
    background-image   : url(./img/kanban-bg-forrestauranttitle.png);
    background-size    : 90% auto;
    background-repeat  : no-repeat;
    background-position: bottom;
}

#title-text {
    font-family        : "filicudi-solid", sans-serif;
    font-optical-sizing: auto;
    font-weight        : 900;
    font-style         : normal;
    font-size          : 5em;
    letter-spacing     : -.05em;
    color              : var(--navy);
}

.title-text-wrap p {
    font-family: "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight: 900;
    font-size  : 1.5em;
}

.dogpark-explantaion p,
u {
    font-family   : "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight   : 900;
    font-size     : 1em;
    letter-spacing: .05em;
    line-height   : 1.8em;
}

@media screen and (max-width:800px) {

    #shibainu-red-pool {
        width: 4em;
    }

    #runnningshiba-black {
        height: 4em;
    }
}

@media screen and (max-width:700px) {

    #dogpark-title-wrap div {
        margin         : 0 1em;
        background-size: 70% auto;

    }

    #title-text {
        font-size: 4em;

    }

    #dogpark-title-wrap {
        margin-top: 20%;
    }

    .title-text-wrap p {
        margin-top: -.5em;
        font-size : 1.2em;
    }
}

@media screen and (max-width:600px) {

    #dogpark-title-wrap div {
        margin         : 0 .5em;
        background-size: 70% auto;

    }

    #title-text {
        font-size: 3em;

    }

    .title-text-wrap p {
        font-size: 1em;
    }

    #shibainu-red-pool {
        width: 3em;
    }

    #runnningshiba-black {
        height: 3em;
    }

    .runs-explantaion {
        font-size: smaller;
    }
}

@media screen and (max-width:400px) {
    #shibainu-red-pool {
        margin-top: 10%;
        width     : 2.5em;
    }

    #runnningshiba-black {
        margin-top: 10%;
        height    : 2.5em;

    }

    #dogpark-title-wrap div {
        margin: 0;

    }
}




/* content start from here  */
#dogrun-content-container {
    margin-top: 10%;
}

.runs-wrap {

    display       : flex;
    flex-direction: column;
}

#dogrun-wrap {
    background-color: var(--whitebeige);
    padding-top     : 5%;
    margin-top      : -1%;
}

.runs-wrap .container {
    margin-top: 10%;
}

#wavy-beige-top {
    width: 100%;
}

.runs-explantaion {
    width : max-content;
    margin: 5% auto;
}

.runs-explantaion p {
    font-family  : "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight  : 800;
    margin-bottom: 15%;
}

#dogrun-title-img-wrap,
#dogpool-title-img-wrap {
    display       : flex;
    flex-direction: column;
    align-items   : center;

}

#img-dogsandbfly {
    width   : 15em;
    position: absolute;
    left    : 0;
}

#img-dogsandglass {
    width   : 12em;
    position: absolute;
    right   : 0;

}

#img-greenwaves,
#img-bluewaves,
#img-orangewaves {
    width     : 7em;
    margin-top: 1em;
}

#dogrun-title-wrap,
#dogpool-title-wrap {
    text-align: center;
}

.dogparksub-eng {
    color    : white;
    font-size: 2em;

}

.dogparksub-jpn {
    font-family   : "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight   : 1000;
    letter-spacing: .05em;
    font-size     : 3em;
}



#dogpark-secondexplantaion {
    margin-bottom: 5%;
}

.dots_container {
    justify-content: center;
}

.imgs-kanban {
    /* width : 70%; */
    max-width: 1000px;
    margin   : 3% auto;

}

#wavy-beige-bottom {
    width: 100%;
}

@media screen and (max-width:900px) {
    #img-dogsandbfly {
        width: 12em;
    }

    #img-dogsandglass {
        width: 11em;

    }
}

@media screen and (max-width:800px) {
    #img-dogsandbfly {
        width: 10em;
    }

    #img-dogsandglass {
        width: 9em;
    }

    .runs-explantaion {
        width        : 70%;
        margin-bottom: 15%;
    }
}

@media screen and (max-width:700px) {
    .dogparksub-jpn {
        letter-spacing: .02em;
        font-size     : 2.5em;
    }

    .dogparksub-eng {
        font-size: 1.5em;
    }
}

@media screen and (max-width:600px) {
    .dogparksub-jpn {
        font-size: 2em;
    }

    .dogparksub-eng {
        font-size: 1.3em;
    }

    #img-dogsandbfly {
        width: 10em;

    }

    #img-dogsandglass {
        width: 10em;
    }
}

@media screen and (max-width:500px) {
    #dogrun-wrap {
        padding-top: 20%;
        margin-top : -3%;
    }

    #img-dogsandbfly {

        margin-top: -25%;
    }

    #img-dogsandglass {
        margin: 0;
    }
}


/* dogpool */
#dogpool-content-container {
    margin-top: 15%;
}

#img-dogandukiwa {
    width   : 15em;
    position: absolute;
    left    : 0;
}

#img-bdogandbeachball {
    width   : 15em;
    position: absolute;
    right   : 0;
}

#dogpoolsub-eng {
    color: var(--lightblue);
}


.runs-wrap {
    /* background-color: blue; */
    height    : fit-content;
    margin-top: auto;
}


.imgs-kanban.pool {
    box-shadow: 0 0 30px gray;
}

@media screen and (max-width:1000px) {

    #img-dogandukiwa,
    #img-bdogandbeachball {
        width: 12em;

    }

}

@media screen and (max-width:700px) {
    #img-dogandukiwa {
        width: 10em;

    }
}

@media screen and (max-width:500px) {
    #dogpool-wrap {
        margin-top: 20%;
    }

    #img-dogandukiwa {
        margin-top: -25%;
    }

    #img-bdogandbeachball {
        margin-top: 5%;
    }
}

@media screen and (max-width:400px) {

    #img-dogandukiwa {
        margin-top: -35%;
    }


}

/* business hour */
#businesshour-content-container {
    margin-top: 10%;
}

#businesshour-title-wrap {
    width          : max-content;
    display        : flex;
    flex-direction : column;
    justify-content: center;
    align-items    : center;
    margin-left    : 20%;
}

#businesshour-title-wrap p {
    font-family: "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight: 800;
    font-size  : 2em;
}

#businesshour-content-wrap {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    justify-content: center;
    max-width      : 1000px;
    margin         : 0 auto;
}

.businesshour-item {
    display        : flex;
    flex-direction : row;
    align-items    : center;
    justify-content: center;
    width          : 90%;
    padding        : 1.5em 3em;
    border-radius  : 50px;
    margin         : 2em auto;
}

.businesshour-item.dogrun {
    background-color: #C9D4B6;
    margin-top      : 5%;
}

.businesshour-item.dogpool {
    background-color: #C1CEDF;
    position        : relative;
}

.businesshour-item.dogpool>img {
    width        : 4em;
    position     : absolute;
    right        : 0;
    margin-bottom: 4em;
}

.businesshour-item.nightrun {
    background-color: #c2c9ce;
    margin-bottom   : 10%;
}

.item-name-wrap {
    display        : flex;
    flex-direction : column;
    justify-content: center;
    align-items    : center;
    width          : auto;
    position       : relative;
    width          : 200px;
}

.item-name-wrap p {
    font-family: "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight: 600;
}

.item-name-wrap img {
    width      : 1.5em;
    margin-left: 80%;
    position   : absolute;
    top        : 0;
}

.itemname-text {
    font-size: 1.2em;
}

.itemnamenote-text {
    font-size: 1em;
}

.hour-text {
    font-family: "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight: 700;
    font-size  : 2em;
    margin     : 0 3em;
    width      : fit-content;
}

.lasthour-text {
    font-family: "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight: 500;
    font-size  : 1em;
    width      : fit-content;
}

#nightrun-hour-wrap {
    display       : flex;
    flex-direction: column;
    margin-left   : 6em;
}

#nightrun-hour-wrap .hour-text {
    margin: 0;
}

#nightrun-hour-wrap div {
    display            : flex;
    flex-direction     : row;
    align-items        : center;
    /* justify-content : flex-start; */

}

#nightrun-hour-wrap>p {
    font-family   : "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight   : 700;
    font-size     : .9em;
    /* margin-left: 10%; */
}

#runpool-text {
    font-size     : .8em;
    letter-spacing: -.1em;
}

#nightrun-hour-wrap .lasthour-text {
    margin-left: 6em;
}

.businesshour-content-messageguide,
.businesshour-content-messageguide a {
    font-family: "maru-maru-gothic-alr-stdn", sans-serif;
    font-weight: 700;
    font-size  : 1em;
}

.businesshour-content-messageguide {
    margin: .3em 0;
}

.businesshour-content-messageguide a {
    color: black;
}



@media screen and (max-width:1200px) {
    .imgs-kanban {
        width: 70%;
    }

    #businesshour-content-wrap {
        width: 70%;

    }

    #nightrun-hour-wrap {
        margin-left: 3em;
    }

    #nightrun-hour-wrap .lasthour-text {
        margin-left: 3em;
    }

    .hour-text {
        margin: 0 1em;
    }
}

@media screen and (max-width:1000px) {
    #dogpool-secondexplantaion p {
        margin-top: 2em;
    }

    .businesshour-item {
        padding: 1em 2em;
    }

    .hour-text {
        font-size: 1.5em;
    }

    #nightrun-hour-wrap>p {
        font-size: .7em;
    }

    .lasthour-text {
        font-weight: 700;
        font-size  : .8em;
        width      : auto;
    }
}


@media screen and (max-width:900px) {
    .item-name-wrap {
        width: 150px;
        ;
    }

    #nightrun-hour-wrap {
        margin-left: 1em;
    }

    #nightrun-hour-wrap .lasthour-text {
        margin-left: 2em;
    }

    .hour-text {
        margin: 0 .5em;
    }

    .item-name-wrap img {
        width      : 1.2em;
        margin-left: 90%;
    }

    .itemname-text {
        font-size: 1em;
    }

    .itemnamenote-text {
        font-size: .8em;
    }

    .businesshour-item.dogpool>img {
        width        : 3em;
        margin-bottom: 5em;
    }
}

@media screen and (max-width:750px) {
    #businesshour-title-wrap p {
        font-size: 1.5em;
    }

    .hour-text {
        font-size: 1em;
    }

    #nightrun-hour-wrap>p {
        font-size: .6em;
    }

    #runpool-text {
        font-size: .5em;

    }
}

@media screen and (max-width:650px) {
    #businesshour-title-wrap {
        margin: 0 auto;
    }

    .imgs-kanban {
        width: 80%;
    }

    #businesshour-content-wrap {
        width: 80%;

    }

    .lasthour-text {
        font-size: .6em;
    }

    .item-name-wrap {
        width       : auto;
        margin-right: 1em;
    }

    .item-name-wrap img {
        width      : 1em;
        margin-left: 110%;
    }
}

@media screen and (max-width:500px) {
    #businesshour-title-wrap {
        margin-top: 15%;
    }

    .itemname-text {
        font-size: .8em;
    }

    .itemnamenote-text {
        font-size: .7em;
    }

    .lasthour-text {
        font-size: .5em;
    }

    #nightrun-hour-wrap>p {
        font-size: .5em;
    }

    .item-name-wrap {
        width       : auto;
        margin-right: .5em;
    }

    .businesshour-item {
        padding: .5em 1em;
    }

    .businesshour-item.dogpool .itemnamenote-text {

        font-size: .5em;
    }

    .item-name-wrap img {
        width      : .8em;
        margin-left: 120%;
    }

    #runpool-text {
        font-size: .4em;

    }
}

@media screen and (max-width:400px) {

    #nightrun-hour-wrap .hour-text {
        font-size: .8em;
    }

    #runpool-text {
        font-size: .3em;

    }

    #nightrun-hour-wrap>p {
        font-size     : .4em;
        letter-spacing: -.1em;
    }

    .businesshour-item.dogpool .itemname-text {
        letter-spacing: -.1em;
    }
}