@charset "UTF-8";

.university-nagano {
  --cream: #fbf6e4;
  --teal: #003940;
  --green: #006837;
  --red: #c1272d;
  --orange: #f7931e;
  --ink: #333;
  --page-width: 500px;
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: "Noto Sans JP", sans-serif;
  -webkit-text-size-adjust: 100%;
}
.university-nagano *, .university-nagano *::before, .university-nagano *::after { box-sizing: border-box; }
.university-nagano :where(h1,h2,h3,h4,p,ul) { margin: 0; }
.university-nagano :where(a) { color: inherit; text-decoration: none; }
.university-nagano :where(img) { display: block; max-width: 100%; height: auto; }
.university-nagano :where(ul) { padding: 0; list-style: none; }
.university-nagano :where(a:focus-visible) { outline: 3px solid #087bb6; outline-offset: 4px; }
.university-nagano :where([id]) { scroll-margin-top: 20px; }
.university-nagano .visually_hidden, .university-nagano .skip_link:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip_link:focus { position: fixed; z-index: 5; top: 12px; left: 12px; padding: 12px; background: white; }
.main_body { container-type: inline-size; width: 100%; max-width: var(--page-width); margin-inline: auto; background: var(--cream); }
.desktop_rail { display: none; }
.hero img { width: 100%; }
.main_cta { display: flex; align-items: center; justify-content: center; margin: 18px 4.73% 32px; padding: 21px 14px; border-radius: 14px; color: #fff; background: var(--red); font-size: clamp(19px,4.3cqi,23px); font-weight: 900; text-align: center; transition: opacity .18s; }
.main_cta:hover, .reserve_button:hover { opacity: .82; }
.briefing { margin: 0 2%; padding: 0 1.8% 21px; border-radius: 27px; background: var(--teal); color: #fff; text-align: center; }
.briefing_audience { padding: 4px 0 9px; color: #fbb03b; font-size: clamp(15px,4.1cqi,21px); font-weight: 500; }
.briefing h2 { color: #f7eadd; background-image: url("../images/briefing-stroke-left.webp"), url("../images/briefing-stroke-right.webp"); background-position: left 10px bottom 7px, right 10px bottom 7px; background-size: 4cqi auto; background-repeat: no-repeat; font-size: clamp(21px,5.1cqi,26px); line-height: 1.5; font-weight: 700; }
.briefing h2 small { display: block; margin-bottom: 3px; font-size: .73em; }
.benefits { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px 12px; margin: 27px 13px 25px; }
.benefits img { width: clamp(88px,22cqi,104px); margin: 0 auto 11px; }
.benefits h3 { color: #ffffcb; font-size: clamp(17px,4cqi,20px); line-height: 1.35; letter-spacing: .03em; }
.benefits p { margin-top: 6px; font-size: clamp(14px,3.2cqi,16px); font-weight: 700; line-height: 1.6; }
.briefing_description { font-size: clamp(17px, 3.6cqi, 18px);; line-height: 1.8; font-weight: 500; }
.dates { margin-top: 10px; }
.dates > h3 { margin-bottom: 9px; color: #fcee21; font-size: clamp(15px,3.4cqi,18px); line-height: 1.7; }
.schedule_grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.schedule { --event-color: #f14424; display: flex; flex-direction: column; min-width: 0; padding: 2px 5px 5px; border-radius: 10px; color: var(--ink); background: #fff; }
.schedule_second { --event-color: #f7931e; }
.schedule_third { --event-color: #006837; }
.schedule_number { color: var(--event-color); font: 500 clamp(26px,6.3cqi,33px)/1.1 "Roboto Condensed",sans-serif; }
.schedule h4 { font-weight: 500; }
.schedule_year { display: block; margin-top: 2px; font: 500 clamp(17px,3.8cqi,20px)/1.1 "Roboto Condensed",sans-serif; }
.schedule_year small { font-family: "Noto Sans JP",sans-serif; font-size: .84em; }
.schedule_date { display: flex; justify-content: center; align-items: center; gap: 2px; margin-top: 2px; white-space: nowrap; font: 500 clamp(24px,5.6cqi,31px)/1.15 "Roboto Condensed",sans-serif; }
.schedule_date > small { align-self: end; padding-bottom: 3px; font: 500 .46em/1.4 "Noto Sans JP",sans-serif; }
.weekday { display: inline-flex; justify-content: center; align-items: center; width: 1.4em; height: 1.4em; border-radius: 50%; color: #fff; background: #2e3192; font: 500 .47em/1 "Noto Sans JP",sans-serif; }
.schedule_time { display: flex; align-items: center; justify-content: center; gap: 4px; margin: 3px 0; color: #2e3192; }
.schedule_time img { width: 26%; max-width: 33px; }
.schedule_time b { white-space: nowrap; font: 700 clamp(21px,4.8cqi,27px)/1.2 "Roboto Condensed",sans-serif; }
.schedule_time small { margin-left: 3px; font-family: "Noto Sans JP",sans-serif; font-size: .67em; font-weight: 700; }
.schedule_time_morning { color: #f15a24; }
.schedule_illustration { width: 100%; height: auto; margin-top: auto; }
.reserve_button { display: flex; align-items: center; justify-content: center; margin-top: 5px; padding: 8px 1px; border-radius: 9px; color: #fff; background: var(--event-color); font-size: clamp(12px,3.25cqi,17px); line-height: 1.28; font-weight: 700; transition: opacity .18s; }
.briefing_notice { --notice-icon-size: 46px; display: flex; align-items: center; margin: 17px 0 0; color: var(--red); text-align: left; }
.briefing_notice img { position: relative; z-index: 1; width: var(--notice-icon-size); flex: 0 0 var(--notice-icon-size); border-radius: 50%; }
.briefing_notice strong { flex: 1; margin-left: calc(var(--notice-icon-size) / -2); padding: 5px 7px 5px calc(var(--notice-icon-size) / 2 + 7px); border-radius: 5px; background: #fff5b1; font-size: clamp(12px,2.8cqi,15px); line-height: 1.5; }
.support { margin: 30px 4.73% 0; text-align: center; }
.able_logo { width: 31.1cqi; margin-inline: auto; }
.support h2 { margin-top: 8px; line-height: 1.55; color: var(--teal); }
.support h2 small { display: block; font-size: clamp(17px,3.8cqi,20px); }
.support h2 strong { display: block; margin-top: 5px; color: #533b0b; font-size: clamp(23px,6cqi,31px); font-weight: 700; }
.support h2 span { display: block; margin-top: 3px; font-size: clamp(16px,4.05cqi,21px); }
.support_grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 19px; text-align: left; }
.support_item { min-width: 0; padding: 11px 10px 13px; border-radius: 15px; background: #fff; }
.support_item > img { width: 100%; aspect-ratio: 1.5; object-fit: cover; }
.support_item h3 { margin: 6px -3px 7px; color: var(--green); font-size: clamp(11px,3.22cqi,17px); line-height: 1.5; text-align: center; letter-spacing: -.045em; }
.support_item p { font-size: clamp(11px,2.8cqi,14px); font-weight: 700; line-height: 1.85; }
.campaign { margin: 12px 3.38% 0; text-align: center; }
.campaign > img { width: 100%; }
.campaign > p { margin: 15px 0 0; color: var(--green); font-size: clamp(12px,2.8cqi,15px); font-weight: 900; line-height: 1.4; }
.contact { margin: 11px 5.8% 0; }
.contact > h2 { margin: 0 -8px 22px; color: var(--teal); font-size: clamp(16px,3.7cqi,19px); line-height: 1.5; text-align: center; }
.store { padding-left: 12px; border-left: 10px solid #dce638; font-size: 13px; font-weight: 500; line-height: 1.6; }
.store + .store { margin-top: 24px; }
.store h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 12px; color: #3b683d; font-size: clamp(23px,5.2cqi,28px); line-height: 1.3; font-weight: 900; }
.store h3 small { font-size: 13px; font-weight: 500; }
.store_phone { display: block; width: fit-content; padding-block: 6px; color: var(--red); font-size: clamp(20px,4.6cqi,25px); line-height: 1.4; font-weight: 700; }
.store_phone:hover { text-decoration: underline; }
.store address { font-style: normal; }
.store_hours { margin-top: 2px; }
.footer { padding: 28px 15px 32px; text-align: center; }
.room_guide_logo { width: 34cqi; margin-inline: auto; }
.footer_tagline { margin: 20px 0 27px; color: #000; font-size: clamp(16px,3.6cqi,19px); font-weight: 700; letter-spacing: .04em; }
.footer_tagline em { color: #ed1c24; font-style: normal; }
.footer .able_logo { width: 34.4cqi; }

@media (min-width: 641px) {
  .university-nagano { background: var(--cream) url("../images/desktop-photo.webp") center / cover fixed; }
  .site_wrapper { min-height: 100vh; padding-block: 24px; background: rgba(252,246,229,.9); }
  .main_body { position: relative; border-radius: 12px; overflow: hidden; box-shadow: 0 18px 65px rgba(38,50,26,.14); }
}
@media (min-width: 1201px) {
  .desktop_rail { display: block; position: fixed; top: 13vh; left: max(30px,calc((100vw - var(--page-width)) / 4 - 126px)); width: 252px; color: var(--teal); text-align: center; }
  .desktop_rail img { width: 222px; margin: 0 auto 24px; }
  .desktop_rail div { font-size: 14px; font-weight: 700; }
  .desktop_rail strong { display: block; margin-top: 15px; font-size: 26px; line-height: 1.65; }
}
@media (max-width: 420px) {
  .main_cta { margin-top: 14px; margin-bottom: 25px; padding-block: 17px; }
  .briefing { border-radius: 23px; padding-bottom: 16px; }
  .benefits { gap: 22px 5px; margin: 22px 6px; }
  .briefing_description { padding-inline: 5px; }
  .wide_break { display: none; }
  .schedule { padding-inline: 4px; border-radius: 8px; }
  .schedule_grid { gap: 5px; }
  .schedule_date { gap: 1px; }
  .schedule_time { gap: 2px; }
  .schedule_time small { margin-left: 1px; }
  .briefing_notice { --notice-icon-size: 39px; margin-top: 12px; }
  .support { margin-top: 23px; }
  .support_grid { gap: 9px; }
  .support_item { padding: 8px 8px 10px; border-radius: 12px; }
  .support_item h3 { letter-spacing: -.065em; }
  .support_item p { line-height: 1.75; }
  .store { border-left-width: 8px; padding-left: 10px; font-size: 12px; }
  .store h3 { display: block; }
  .store h3 small { display: block; margin-bottom: 3px; font-size: 12px; }
}
@media (max-width: 359px) {
  .briefing_audience { font-size: 13px; }
  .briefing h2 { font-size: 18px; background-position: left bottom 5px, right bottom 5px; }
  .schedule_date { font-size: 21px; }
  .schedule_time b { font-size: 19px; }
  .reserve_button { font-size: 11px; }
  .support h2 strong { font-size: 20px; }
  .support h2 span { font-size: 14px; }
  .support_item h3 { font-size: 10.6px; }
  .contact > h2 { font-size: 14px; }
}
@media (prefers-reduced-motion: no-preference) {
  html:has(.university-nagano) { scroll-behavior: smooth; }
}