.totutotu #hero{
    padding-top: 170px;
    text-align: center;
}

.totutotu .inner{
    width: 900px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 166px;
}

.totutotu #hero h2{
    font-size: 28px;
    font-weight: 400;
    line-height: 1.75;
    padding-bottom: 90px;
    letter-spacing: 6px;
    }

.totutotu #hero img.illust{
 margin:0 auto;
    }


/*intro*/
.totutotu #intro .inner{
    border-bottom: 1px dotted #707070;
}
.totutotu #intro h3{
    font-size:25px;
    font-weight:400;
    line-height: 1.75;
    text-align: center;
    }


.totutotu #intro h3 span{
        font-size:20px;
        display: block;
}

.totutotu #intro p.text{
    max-width: 430px;
    text-align: justify;
    margin: 75px auto;
    line-height: 2;
}

.totutotu #intro img.photo{
    width:100%;
    max-width:580px;
}

.totutotu #intro p.name{
    max-width: 430px;
    text-align: right;
    line-height: 2;
    margin: 0 auto;
}


.totutotu #intro p.name span{
    display: block;
    font-size: 10px;
}

.totutotu #intro a.grayback{
    margin: 110px auto 0;
    display: block;
    background: #F0F0F0;
    padding: 30px;
    max-width: 580px;
    border-radius: 10px;
    text-decoration: none;
    transition: transform 0.3s;
}

.totutotu #intro a.grayback:hover {
    transform: translateY(3px);
}

/*summary*/

.totutotu #summary .inner{
    padding-top:115px;
    border-bottom: 1px dotted #707070;
}

.totutotu #summary h3{
    font-size:25px;
    font-weight:300;
    line-height: 1.75;
    text-align: center;
    padding-bottom:70px;
    }

.totutotu #summary .column{
    display: flex;
    border-top: 1px solid #707070;
    align-items: center;
    gap: 90px;
    padding: 10px 0;
    max-width: 580px;
    margin: 0 auto;
}

.totutotu #summary .last-child{
    border-bottom: 1px solid #707070;
}
.totutotu #summary .column dt{
    width: 100px;
    text-align: left;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 1px;
}
.totutotu #summary .column dd{
    margin: 0;
    width: 410px;
    text-align: left;
}


@media (max-width: 768px) {
    .totutotu .inner {
        width: 90%;
padding:40px 10px;
    }
    .totutotu p.text {
        margin: 40px auto!important;
    }
    .totutotu #hero h2.catch {
        font-size: 26px;
        text-align: center;
    }
    .totutotu #hero {
        padding-top: 0px;
    }
    .totutotu #hero h2 {
        padding-bottom: 60px;
            font-size: 22px;
    }

    /*intro*/
    .totutotu #intro .inner {
        padding-top: 0;
    }
    .totutotu #intro h3 {
        font-size: 20px;
    }
    .totutotu #intro h3 span{
        font-size: 16px;
    }
    .totutotu #intro p.text {

    }

    .totutotu #intro a.grayback {
        margin: 60px auto 40px;
    }

    /*summary*/
    .totutotu #summary .inner {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .totutotu #summary .column {
        gap: 10px;
    }
    .totutotu #summary .column dt {
        width: 180px;
        font-size: 14px;
    }
    .totutotu #summary .column dd {
        font-size: 14px;
    }
}