@font-face {
  font-family: "Source Han Sans CN";
  src: local("SourceHanSansCN-Medium"), url("/special/_assets/www.guandian.cn/statics/course2026_11xinghe/fonts/SourceHanSansCN-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Source Han Sans CN";
  src: local("SourceHanSansCN-Bold"), url("/special/_assets/www.guandian.cn/statics/course2026_11xinghe/fonts/SourceHanSansCN-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

/* Original font files supplied by guandian.cn/font/. Keep them on the same
   origin as the page so local previews do not depend on cross-origin access. */
@font-face {
  font-family: "JDLangZhengTi";
  src: url("/special/_assets/www.guandian.cn/statics/course2026_11xinghe/fonts/jdlzt.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Alimama ShuHeiTi";
  src: url("/special/_assets/www.guandian.cn/statics/course2026_11xinghe/fonts/almmsht.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --main-width: 924px;
  --page-bg: #f1f9fe;
  --blue: #0058ea;
  --orange: #f79154;
  --text: #1a1919;
  --body-font: "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  --heading-font: "Source Han Sans CN", "Microsoft YaHei", sans-serif;
}

* {
  box-sizing: border-box;

}
html {
  scroll-behavior: smooth;

}
body {
  margin: 0;
  background: var(--page-bg);
  color: var(--text);
  font-family: var(--body-font);

}
h1, h2, h3, p, figure, ul {
  margin: 0;
  padding: 0;

}
ul {
  list-style: none;

}
a {
  color: inherit;
  text-decoration: none;

}
img {
  display: block;
  max-width: 100%;
  height: auto;
  border: 0;

}
a[href], [tabindex="0"] {
  -webkit-tap-highlight-color: transparent;

}
a:focus-visible, [tabindex="0"]:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 5px;

}
section[id] {
  scroll-margin-top: 24px;

}

/* 1600px PSD canvas;
the content remains a centered 924px column. */
.wrap {
  background: url("https://www.guandian.cn/statics/course2026_11xinghe/img/hero-bg.png") no-repeat center top;

}
.head {
  height: 373px;
  padding-top: 18px;

}
.nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 17px;
  min-height: 20px;
  color: #fff;
  font-size: 14px;
  line-height: 20px;

}
.nav a {
  white-space: nowrap;

}
.nav a[href]:hover {
  text-decoration: none;

}
.slogan {
  width: var(--main-width);
  margin: 78px auto 0;
  container-type: inline-size;

}
.slogan_subtitle {
  margin-left: 1px;
  /* Clip only the pre-transform width; the visible glyphs fit the column. */
  overflow-x: clip;
  overflow-clip-margin: 4px;
  font-family: "JDLangZhengTi", var(--heading-font);
  font-size: 37.794px;
  font-size: min(37.794px, 5.77cqw);
  font-weight: 700;
  line-height: 1.08483;
  letter-spacing: 0.028em;
  white-space: nowrap;
  filter: drop-shadow(0.03969em 0 0 #fff) drop-shadow(-0.03969em 0 0 #fff)
    drop-shadow(0 0.03969em 0 #fff) drop-shadow(0 -0.03969em 0 #fff);

}
.slogan_subtitle span {
  display: inline-block;
  vertical-align: top;
  background: linear-gradient(to bottom, #f8a877, #f68847);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  /* Match the PSD's condensed text transform and synthetic-bold tracking. */
  transform: translateY(0.0085em) scaleX(0.75911);
  transform-origin: left center;
}
.slogan h1 {
  margin-top: 15px;
  color: #fff;
  font-family: "Alimama ShuHeiTi", var(--heading-font);
  font-size: 41.59px;
  font-size: min(41.59px, 5.03cqw);
  font-weight: 700;
  line-height: 1.10603;
  white-space: nowrap;

}
.slogan h1 > span {
  display: inline-block;
  vertical-align: top;
  transform: translateY(-0.005em) scaleX(0.99353);
  transform-origin: left center;
}
.slogan_separator {
  font-family: var(--heading-font);
  font-weight: 500;
  line-height: 0;
}
.slogan_date {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 346px;
  min-height: 43px;
  margin: 30px 0 0 -2px;
  border-radius: 24px;
  background: #0059ed;
  color: #fff;
  font-family: var(--heading-font);
  font-size: 23.205px;
  font-weight: 700;
  line-height: 1.3;

}
.main {
  width: var(--main-width);
  margin: 0 auto;

}

/* The frame is a transparent PSD slice. Text and actions use normal flow. */
.intro {
  width: 951px;
  min-height: 358px;
  margin-left: -13px;
  padding: 59px 36px 19px 55px;
  background: url("https://www.guandian.cn/statics/course2026_11xinghe/img/intro-frame.png") no-repeat center top / 100% 100%;

}
.intro_box {
  height: 230px;
  padding-right: 22px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  font-size: 14px;
  line-height: 21px;

}
.intro_box p + p {
  margin-top: 21px;

}
.intro_box::-webkit-scrollbar {
  width: 10px;

}
.intro_box::-webkit-scrollbar-track {
  border-radius: 8px;
  background: #d8dbd9;

}
.intro_box::-webkit-scrollbar-thumb {
  border: 1px solid #d8dbd9;
  border-radius: 8px;
  background: #969c9e;

}
.intro_link {
  display: flex;
  justify-content: center;
  margin: 20px -36px 0 -55px;

}
.intro_link a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 163px;
  height: 30px;
  background: #559de8;
  clip-path: polygon(12px 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
  color: #fff;
  font-family: var(--heading-font);
  font-size: 18px;
  font-style: italic;
  font-weight: 700;
  line-height: 1;

}
.intro_link a + a {
  margin-left: -3px;
  background: #fb955e;

}
.intro_link a[href]:hover {
  filter: brightness(1.06);

}

/* Shared section heading: editable text, with only decoration positioned. */
.title {
  position: relative;
  display: flex;
  justify-content: center;
  width: 177px;
  height: 44px;
  margin: 0 auto;
  background: url("https://www.guandian.cn/statics/course2026_11xinghe/img/title-underline.png") no-repeat center bottom / 177px 20px;
  color: var(--blue);
  font-family: var(--heading-font);
  font-size: 36px;
  font-weight: 700;
  line-height: 40px;
  transform: translateX(1px);

}
.title span {
  transform: translate(-1px, -1px);

}
.title span + span {
  color: var(--orange);

}
.title::before, .title::after {
  position: absolute;
  top: 0;
  width: 38px;
  height: 38px;
  background: no-repeat center / contain;
  content: "";

}
.title::before {
  left: -40px;
  background-image: url("https://www.guandian.cn/statics/course2026_11xinghe/img/title-left.png");

}
.title::after {
  right: -40px;
  background-image: url("https://www.guandian.cn/statics/course2026_11xinghe/img/title-right.png");

}

.schedule {
  margin-top: 64px;

}
.schedule_box {
  display: grid;
  grid-template-columns: minmax(0, 642px) 294px;
  align-items: start;
  width: 936px;
  margin: 28px 0 0 -5px;

}
.schedule_list {
  min-width: 0;

}
.schedule_item + .schedule_item {
  margin-top: 16px;

}
.schedule_heading {
  display: flex;
  align-items: center;
  gap: 13px;
  width: 569px;
  max-width: 100%;
  min-height: 33px;
  padding: 5px 11px 2px;
  background: linear-gradient(90deg, #27d4e8 0%, #a2e8f3 48%, rgba(241, 249, 254, 0) 100%);
  color: #1257a8;

}
.schedule_time {
  flex: 0 0 100px;
  white-space: nowrap;
  font-size: 18px;
  line-height: 26px;
  transform: translateY(1px);

}
.schedule_heading h3 {
  font-family: var(--heading-font);
  font-size: 20px;
  font-weight: 700;
  line-height: 26px;

}
.schedule_note, .schedule_direction {
  color: #504949;
  font-family: var(--heading-font);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;

}
.schedule_note {
  margin-top: 5px;
  padding: 0 4px 0 11px;

}
.schedule_speakers {
  display: grid;
  gap: 12px;
  margin: 10px 0 0;
  padding: 0 4px 0 11px;
  color: #4c93e7;
  font-family: var(--heading-font);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;

}
.schedule_direction {
  margin-top: 2px;

}
.schedule_item:nth-child(3) {
  margin-top: 27px;

}
.schedule_item:nth-child(4) {
  margin-top: 22px;

}
.schedule_photo {
  margin-top: 3px;

}

.news {
  margin-top: 78px;

}
.news_box {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 88px;
  margin-top: 42px;

}
.news_box li {
  min-width: 0;

}
.news_box a {
  position: relative;
  display: block;
  padding-left: 27px;
  font-size: 16px;
  line-height: 24px;
  overflow-wrap: break-word;

}
.news_box a::before {
  position: absolute;
  top: 3px;
  left: -1px;
  width: 26px;
  height: 17px;
  background: url("https://www.guandian.cn/statics/course2026_11xinghe/img/news-icon.png") no-repeat center / contain;
  content: "";

}
.news_box a:hover {
  color: var(--blue);

}

.live {
  margin-top: 80px;

}
.live_box {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 175px;
  gap: 19px 14px;
  width: calc(100% + 16px);
  height: 369px;
  margin-top: 43px;
  padding-right: 8px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;

}
.live_box img {
  width: 100%;
  height: 175px;
  border-radius: 5px;
  object-fit: cover;

}
.live_box::-webkit-scrollbar {
  width: 8px;

}
.live_box::-webkit-scrollbar-track {
  border-radius: 8px;
  background: #e2f1f7;

}
.live_box::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background: #7ed5e5;

}
.live_box::-webkit-scrollbar-thumb:hover {
  background: #38bdcf;

}

.group {
  margin-top: 74px;
  padding-bottom: 96px;

}
.group_box {
  display: grid;
  grid-template-columns: 414px 369px;
  align-items: end;
  gap: 22px;
  margin-top: 40px;
  padding-left: 66px;
  color: #333;

}
.g_con1 h3 {
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;

}
.g_con1 p {
  font-size: 12px;
  line-height: 24px;

}
.g_con1 a[href]:hover {
  text-decoration: underline;

}
.group_wechat {
  padding-left: 60px;

}
.qrcode {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: end;
  gap: 7px;
  padding-bottom: 4px;

}
.qrcode figure {
  min-width: 0;
  text-align: center;

}
.qrcode img {
  width: auto;
  max-width: 100%;
  margin: 0 auto 4px;
  image-rendering: crisp-edges;

}
.qrcode figcaption {
  font-size: 11.5px;
  line-height: 16px;
  white-space: nowrap;

}
.qrcode figure:last-child figcaption {
  margin: 0 -10px;

}

.footerwrap {
  background: #1c377f;
  color: #fff;

}
.footer {
  display: grid;
  grid-template-columns: 104px minmax(0, 822px);
  align-items: center;
  gap: 66px;
  width: 1000px;
  min-height: 370px;
  margin: 0 auto;
  padding: 50px 0 78px 7px;

}
.footer_r {
  font-size: 14px;
  line-height: 24px;

}
.footer_r p {
  text-indent: 2em;

}
.footer_r p + p {
  margin-top: 24px;

}

/* Narrower desktops retain the PSD column;
smaller screens reflow naturally. */
@media (max-width: 1020px) {
  :root {
    --main-width: calc(100% - 64px);

  }
  .intro {
    width: calc(100% + 26px);

  }
  .schedule_box {
    width: calc(100% + 10px);
    grid-template-columns: minmax(0, 1fr) 29%;
    gap: 20px;

  }
  .schedule_heading {
    width: 100%;

  }
  .schedule_time {
    flex-basis: 100px;

  }
  .news_box {
    column-gap: 36px;

  }
  .group_box {
    grid-template-columns: minmax(0, 1fr) 369px;
    gap: 28px;
    padding-left: 0;

  }
  .group_wechat {
    padding-left: 0;

  }
  .footer {
    width: calc(100% - 64px);
    grid-template-columns: 104px minmax(0, 1fr);
    gap: 42px;
    padding-left: 0;

  }
}

@media (max-width: 720px) {
  :root {
    --main-width: calc(100% - 40px);

  }
  .wrap {
    background-position: 57% top;
    background-size: auto 470px;

  }
  .head {
    height: 320px;
    padding-top: 18px;

  }
  .nav {
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 0 20px;
    font-size: 12px;

  }
  .slogan {
    margin-top: 66px;

  }
  .slogan h1 {
    margin-top: 12px;

  }
  .slogan_date {
    width: max-content;
    max-width: 100%;
    min-height: 36px;
    margin-top: 24px;
    padding: 5px 18px;
    font-size: 18px;

  }
  .intro {
    width: calc(100% + 16px);
    margin-left: -8px;
    padding: 45px 25px 24px;

  }
  .intro_box {
    height: 230px;
    padding-right: 12px;

  }
  .intro_link {
    margin: 21px -10px 0;

  }
  .intro_link a {
    width: 156px;
    font-size: 16px;

  }
  .schedule, .news, .live, .group {
    margin-top: 56px;

  }
  .schedule_box {
    grid-template-columns: minmax(0, 1fr);
    gap: 26px;
    width: 100%;
    margin-left: 0;

  }
  .schedule_heading {
    gap: 10px;
    padding-left: 8px;

  }
  .schedule_time {
    flex-basis: 91px;
    font-size: 16px;

  }
  .schedule_heading h3 {
    font-size: 18px;

  }
  .schedule_note, .schedule_speakers {
    padding-left: 8px;

  }
  .schedule_photo {
    width: 220px;
    margin: 0 auto;

  }
  .news_box {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 20px;
    margin-top: 32px;

  }
  .live_box {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 120px;
    height: 259px;
    margin-top: 32px;

  }
  .live_box img {
    height: 120px;

  }
  .group {
    padding-bottom: 56px;

  }
  .group_box {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
    margin-top: 32px;

  }
  .qrcode {
    max-width: 369px;

  }
  .qrcode figcaption {
    font-size: 10px;

  }
  .footer {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    width: calc(100% - 40px);
    padding: 38px 0;

  }
  .footer_l img {
    width: 88px;

  }
  .footer_r {
    font-size: 12px;
    line-height: 22px;

  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;

  }
}