body > header {
    background:url(../img/special/header_circle.svg) bottom center / 1000px no-repeat;
    padding:100px 0 140px 0;
    margin-bottom:40px;

    .true-world {
        padding:0;
    }

    .ts-carousel {
        margin-top:0;

        .ts-carousel-track {
            gap:10px;

            .ts-carousel-item {
                --ts-flow-width:300px;

                figure {
                    border-radius:10px;
                }
            }
        }    
    }

    hgroup {
        max-width:743px;
        margin-inline:auto;

        h3 {
            font-size: clamp(16px, 3cqw, 24px);
            line-height: 1.5;
            margin-top: 20px;
            font-weight: 700;
            color: var(--color-red);
            z-index:2;
            text-align:center;

            img {
                position:absolute;
                width:min(24%, 126px);
                left:-10px;
                bottom:-40px;
                margin-bottom:0;
            }
        }

        h4 {
            background:var(--color-red);
            color:var(--color-white);
            font-size: clamp(16px, 5cqw, 30px);
            padding:15px 5px;
            margin:10px auto 0 auto;
            text-align:center;
            border-radius:10px;
            z-index:1;
        }

        h1 {
            margin:30px auto;
        }
    }
}


@media (width <= 720px) {
    body > header {
        padding:80px 0 100px 0;
        background:url(../img/special/header_circle.svg) bottom center / 800px no-repeat;

        .ts-carousel .ts-carousel-track .ts-carousel-item {
            --ts-flow-width:200px;
        }
    }
}
@media (width <= 520px) {
    body > header {
        background:url(../img/special/header_circle.svg) bottom center / 700px no-repeat;

        hgroup {
            h3 img {
                position:static;
            }
            h4 {
                width:100%;
            }
        }
    }
}

#about {
    .guest{
        figure {
            width:30%;
        }
        h2 + div {
            margin-top:5px;
        }
        h3 small {
            padding-bottom:10px;
        }
        p {
            text-align:justify;
            margin-top:10px;
        }
    }

    .pink-border-box {
        .title-type-1 {
            flex-direction: row;
        }
        .photos {
            gap:10px;
            margin-top:20px;
        }    
    }
}

#info {
    padding-top:0; 

    > div:first-of-type {
        padding-top:0;
    }

    address {
        font-size: min(var(--ts-font-size-max), calc(1em * pow(var(--ts-step), 3)));
        font-weight:bold;
    }
    h2.en {
        font-size:1.6em;
    }
    .info-data {
        max-width:var(--inner-max-width);
        margin-left:auto;
        margin-right:auto;

        > div {
            margin-top:0;
            padding:20px 0;
            align-items: center;
            font-size:1.1em;

            &:not(:last-of-type) {
                border-bottom:dotted 1px var(--color-red);
            }
            dt {
                display:flex;
                align-items: center;
                justify-content: flex-start;
                gap:10px;
                max-width:6em;
            }
        }
    }

    .attention {
        padding-top:0;
        padding-bottom:0;

        article {
            border:solid 2px var(--color-red);
            background:var(--color-white);
            border-radius:1em;
            font-size:1.2em;
            padding-top:2em;
            padding-bottom:2em;
            font-weight:bold;
        }
    }
}

#entry {
    .red-box .width-limiter {
        max-width:1000px;

        h2 {
            font-size:1.1em;
        }

        ul {
            margin-top:20px;
        }
        li {
            margin-top:0;
            text-align:justify;
        }
    }
    aside {
        background:var(--color-white);
        padding:20px;
        border-radius:10px;
        max-width:80%;
        margin-inline:auto;
        margin-top:48px;

        > div {
            width:fit-content;
            margin-inline:auto;
        }
        figure {
            width:130px;
        }
        p {
            flex:1;
            color:var(--color-brown);
            text-align:left;
        }
    }

    .width-limiter .width-limiter h2.en {
        font-size:1.4em;

        + h3 {
            text-align: center;
            font-size:1.1em;
            font-weight: 500;
            line-height:1.4;
        }
    }
}

main .cards {
    article {
        p {
            text-align:justify;
        }
    }
}

@media (width <= 520px) {
    main {
        .red-box p {
            text-align:justify;
        }

        #about {
            .guest{
                figure {
                    width:80%;
                }
                h3 {
                    font-size:1.4em;
                }
                p {
                    text-align:center;
                }
            }
            .food {
                h3 {
                    font-size:1.2em;
                }
            }
            .pink-border-box {
                .photos {
                    grid-template-columns: repeat(2, 1fr);
                }    
            }
        }

        #info {
            .info-data {
                > div {
                    align-items: flex-start;
                    dt {
                        width:100%;
                    }
                }
            }

            .red-border-box + h1 {
                margin-top:60px;
            }
        }

        #entry {
            aside {
                p {
                    display:flex;
                    align-items: center;
                    justify-content: flex-start;
                    gap:5px;
                }
            }

            .width-limiter .width-limiter h2.en {
                + h3 {
                    font-size:1em;
                }
            }
        }
    }
}