.main {
    position: relative;
    display: flex;
    margin: 0 auto;
    width: 100%;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.main::-webkit-scrollbar {
    display:none;
}

.main .page {
    position: relative;
    display: inline-block;
    padding: 0 7.6%;
    width: 100%;
    height: 100%;
    flex-shrink: 0;
    scroll-snap-align: start;
    transition: max-height 0.5s cubic-bezier(0.65, 0.05, 0.36, 1);
}

.main .page .container {
    display: flex;
    height: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
}



#welcome .background {
    margin-bottom: 3rem;
    width: 100%;
    height: 23rem;
    background-image: url("/public/images/anniversary20/background-20.png");
}

#welcome .h2,
#welcome .text {
    margin: 0 0.5rem;
    text-align: left;
}

#welcome .h2 {
    margin-bottom: 2.6rem;
}

#welcome .text {
    margin-bottom: 3.6rem;
}



#info .h2 {
    margin-top: 3rem;
    margin-bottom: 3.2rem;
}

#infoSubmit {
    margin: 3rem auto;
}


#success .calendar {
    display: flex;
    margin-top: 2rem;
    margin-bottom: 6rem;
    /*padding: 2.2rem 2.2rem;*/
    padding: 2.2rem 3.6rem;
    background: #FFFFFF40;
    border-radius: 1.6rem;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}

#success .calendar .left {
    /*width: 13rem;*/
    width: 16.0rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.8rem;
    text-align: left;
    border-right: solid 0.04rem;
}

#success .calendar .right {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 1.6rem;
}

#success .calendar .right .item {
    height: 4.7rem;
    width: 4.7rem;
}

#success .calendar .right .item.cal {
    background-image: url("/public/images/anniversary20/icon-calendar.svg");
    border-radius: 1.2rem;
}

#success .calendar .right .item.calGoogle {
    background-image: url("/public/images/anniversary20/icon-calendar-google.png");
}


#success .h1 {
    margin-bottom: 2.4rem;
}

#success .button {
    margin-top: 3.6rem;
    margin-bottom: 0rem;
}


#history .history {
    display: flex;
    margin-top: 54rem;
    font-size: 3.6rem;
    font-weight: 500;
    line-height: 4.0rem;
    text-align: center;
    align-items: center;
    justify-content: center;
}