@charset "UTF-8";

.container {
    position: relative;
    display: grid;
    align-items: end;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 100%;
    min-height: 100vh;
}

/* system */
.main {
    background-color: #FFFDFD;
}
.button {
    text-align: center;
    margin-top: 83px;
    margin-right: 87px;
}
/* .price__btn {
    text-align: center;
    font-size: 1.6rem;
    background-color: #F1D8DE;
    width: 87px;
    height: 38px;
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
} */
/* .system__btn {
    text-align: center;
    font-size: 1.6rem;
    background-color: #F6EDEF;
    width: 117px;
    height: 38px;
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
}
.system {
    margin-top: 0;
} */

/* リニューアル工事中 */
.system__front {
   margin: 0 auto;
    padding: 45px 43px 49px 36px;
    width: 331px;
    height: auto;
    border-radius: 20px; 
}
.renewal {
    font-size: 1.6rem;
    text-align: center;
}

@media screen and (min-width: 769px) {
    .renewal {
    font-size: 2rem;
    text-align: center;
}

}
/* リニューアル工事中 */

/* .system__front {
    margin: 0 auto;
    background-color: #F1D8DE;
    padding: 45px 43px 49px 36px;
    width: 331px;
    height: auto;
    border-radius: 20px;
}
.system__item {
    width: 258px;
    margin-top: 42px;
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.system__item:nth-of-type(2) {
    margin-top: 15px;
}
.system__item:first-of-type {
    margin-top: 0;
}
.system__title {
    font-size: 1.8rem;
}
h3 {
    margin-left: 8px;
    margin-top: 42px;
}
.span {
    font-size: 1.2rem;
    margin-left: 6px;
} 
.system__price{
    font-size: 1.8rem;
}
.system__time {
    font-size: 1.4rem;
}
.system__topic2 {
    margin-top: 42px;
}
.system__title2 {
    font-size: 1.4rem;
} */

/* @media screen and (min-width: 769px) {
    .button {
        margin-right: 393px;
    }
    .system__front {
        width: 725px;
        height: 430px;
        display: flex;
        justify-content: space-around;
    }
    .system__topic{
        height: 461px;
    }
    .system__topic2 {
        margin-top: -1px;
        margin-left: 30px;
    }
    .system__title2 {
        font-size: 1.6rem;
    }
    .span {
        margin-left: 3px;
    }
} */

/* @media screen and (min-width: 988px) {
    .button {
        margin-top: 100px;
    }
} */

/* .system__back {
    position: absolute;
    top: 121px;
    margin: 0 auto;
    background-color: #F6EDEF;
    padding: 72px 43px 49px 43px;
    width: 331px;
    height: 526px;
    border-radius: 20px; 
    transform: translateX(-300%);
    translate : 50%;
    right: 50%;
    transition: top 0.3s ease;
}
.system__back.active {
    transform: translateX(0);
}
.back__list {
    font-size: 1.6rem;
}
.back__item {
    margin-top: 44px;
}
.back__item:first-of-type {
    margin-top: 0;
} */
/* 
@media screen and (min-width: 769px) {
    .system__back {
        padding: 95px 58px 49px 43px;
        width: 725px;
        height: 430px;
    }
}
@media screen and (min-width: 988px) {
    .system__back {
        top: 138px;
    }
} */

/* banner */
.banner {
    text-align: center;
    width: 100%;
    height: auto;
    padding: 70px 12.8% 30px 12.8%;
    cursor: pointer;
}
.banner__link img:hover {
    opacity: 0.7;
}
.banner__link img {
    width: 278px;
    height: 174px;
    border-radius: 10px;
}

/* wavefooter */
.wavefooter {
    background: linear-gradient(to bottom, #FFFDFD 0%, #FFFDFD 50%, #C48FA9 50%, #C48FA9 100%);
}
.wavefooter__sp {
    width: 100%;
    display: block;
}
.wavefooter__pc {
    display: none;
}

@media screen and (min-width: 769px) {
    .wavefooter__pc {
        width: 100%;
        display: block;
    }
    .wavefooter__sp {
        display: none;
    }
}
/* pc 769px */