/* The approved music-room artwork has no baked-in lettering. */
@font-face {
  font-family:"Bellwood Notice Serif";
  src:url('/assets/fonts/notice-serif-600.ttf') format('truetype');
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face {
  font-family:"Bellwood Notice Gothic";
  src:url('/assets/fonts/notice-gothic-400.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
.portal-hero.notice-hero {
  display:flex;
  align-items:center;
  justify-content:center;
  container-type:inline-size;
  align-self:start;
  background:radial-gradient(ellipse at center,#fff3d5,#e9cf9f);
}
.portal-hero.notice-hero:after { content:none; }
.notice-artwork {
  position:relative;
  flex:none;
  width:100%;
  aspect-ratio:1672 / 941;
  overflow:hidden;
  container-type:inline-size;
  --notice-centre:37.201%;
  --notice-intro-y:23.167%;
  --notice-first-y:33.156%;
  --notice-main-y:43.889%;
  --notice-detail-first-y:58.555%;
  --notice-detail-last-y:64.081%;
  --notice-intro-size:1.79426cqw;
  --notice-first-size:4.30622cqw;
  --notice-main-size:4.72488cqw;
  --notice-detail-size:1.85407cqw;
}
.notice-artwork .notice-background {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:fill;
}
.notice-artwork .notice-heading,
.notice-artwork .notice-detail {
  position:absolute;
  inset:0;
  margin:0;
  padding:0;
  line-height:1;
  font-synthesis:none;
}
.notice-heading span,
.notice-detail span {
  position:absolute;
  left:var(--notice-centre);
  transform:translate(-50%,-50%);
  display:block;
  width:max-content;
  white-space:nowrap;
  text-align:center;
}
.notice-heading .notice-kicker,
.notice-artwork .notice-detail {
  font-family:"BIZ UDGothic","Bellwood Notice Gothic",sans-serif;
  font-weight:400;
  color:#61462d;
}
.notice-heading .notice-kicker {
  top:var(--notice-intro-y);
  font-size:var(--notice-intro-size);
  letter-spacing:.04em;
}
.notice-heading .notice-first,
.notice-heading .notice-main {
  font-family:"Yu Mincho",YuMincho,"Bellwood Notice Serif",serif;
  font-weight:600;
  color:#304528;
}
.notice-heading .notice-first {
  top:var(--notice-first-y);
  font-size:var(--notice-first-size);
  letter-spacing:.02778em;
}
.notice-heading .notice-main {
  top:var(--notice-main-y);
  font-size:var(--notice-main-size);
  letter-spacing:.01519em;
}
.notice-artwork .notice-detail {
  font-size:var(--notice-detail-size);
  letter-spacing:.03226em;
}
.notice-detail-first { top:var(--notice-detail-first-y); }
.notice-detail-last { top:var(--notice-detail-last-y); }
@media(min-width:761px) {
  body[data-page=top] #main { overflow:auto; }
  .portal-top { height:auto; min-height:100%; align-content:start; grid-template-rows:auto clamp(244px,28dvh,336px); }
}
@media(max-width:760px) {
  body[data-page=top] #main { overflow:auto; }
  .portal-top {
    height:100%;
    min-height:0;
    grid-template-rows:auto minmax(150px,1fr);
  }
  .portal-hero.notice-hero {
    height:auto;
    aspect-ratio:auto;
    align-self:start;
    container-type:inline-size;
  }
  .notice-artwork { width:100%; }
}