<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">#about {
    padding-top:calc(var(--section-space) + 80px);
}
#logocar {
    width:220px;
    position:absolute;
    top:var(--section-space);
    left:-300px;
    transition: left 2s;
    animation:logocar 0.6s linear infinite alternate;
}
#logocar.visible {
    left:calc(50% - 110px);
}

@keyframes logocar {
    0% {
		rotate: -1deg;
        top:calc(var(--section-space) + 1px);
	}
    25% {
        rotate: 0deg;
        top:var(--section-space);
    }
    75% {
        rotate: 1deg;
        top:calc(var(--section-space) + 2px);
    }
    100% {
		rotate: 0deg;
        top:var(--section-space);
	}
}

#about ul {
    margin-left:auto;
    margin-right:auto;
    max-width:900px;
}
#about ul li {
    background:var(--color-yellow);
    text-align:center;
    padding:var(--padding);
    border-radius:var(--radius);
}
#about ul li .count {
    text-align:center;
    font-size:2.4em;
    font-family: "FrankfurterPlain", "Noto Sans JP", sans-serif;
    height:1.4em;
    font-weight:normal;
}
#about ul li i {
    font-style:normal;
}
#about ul li i.icon {
    margin-left:auto;
    margin-right:auto;
}
#about ul li p {
    margin-top:0;
}

#message h3 {
    padding-inline:calc(var(--padding) * 2);
}
#message &gt; div {
    padding-left:calc(var(--padding) * 2);
    padding-right:calc(var(--padding) * 2);
}


#details &gt; figure {
    width:100dvw;
    height:600px;
    margin:0;
    overflow:hidden;
}
#details &gt; figure img {
    width:100%;
    height:100%;
    object-fit: cover;
}
#details .white-box {
    top:-150px;
}


@media (max-width : 920px) {

}
@media (max-width : 720px) {
    #message figure {
        display:flex;
        gap:var(--gap);
    }
    #message figure p {
        margin-top:0;
    }

    #details &gt; figure {
        height:400px;
    }
    #details .white-box {
        top:-100px;
    }
}
@media (max-width : 540px) {
    #about ul.grid-column-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width : 520px) {
    #message &gt; div {
        padding-left:var(--padding);
        padding-right:var(--padding);
    }
    #message figure {
        flex-direction: column;
    }
}</pre></body></html>