@charset "UTF-8";
.l-hero { position: relative; color: #fff; }
.l-hero .c-hero__ttl { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.l-hero .c-hero__ttl span { display: block; line-height: 1; margin-bottom: 0.2em; font-weight: 600;}
@media screen and (min-width:768px) {
    .l-hero { background: url(/thermodynamics/assets/img/bg-hero-page.webp) no-repeat center / cover; height: 21.563em; }
    .l-hero .c-hero__ttl { font-size: 1.125em; }
    .l-hero .c-hero__ttl span { font-size: 2.625em; }
}
@media screen and (min-width:768px) and (max-width:1120px) { }
@media screen and (max-width:767px) {
    .l-hero { background: url(/thermodynamics/assets/img/sp/bg-hero-page.webp) no-repeat center / cover; height: 14.071em; }
    .l-hero .c-hero__ttl { font-size: 1em; width: 100%; }
    .l-hero .c-hero__ttl span { font-size: 1.786em; }
}