@charset "UTF-8";

.base {
  /* 【部分重置】 */
  /* http://meyerweb.com/eric/tools/css/reset/ 
    v2.0 | 20110126
    License: none (public domain)
  */
}
.base a,
.base address,
.base article,
.base aside,
.base audio,
.base b,
.base blockquote,
.base body,
.base canvas,
.base caption,
.base cite,
.base code,
.base dd,
.base del,
.base details,
.base dfn,
.base div,
.base dl,
.base dt,
.base em,
.base embed,
.base fieldset,
.base figcaption,
.base figure,
.base footer,
.base form,
.base h1,
.base h2,
.base h3,
.base h4,
.base h5,
.base h6,
.base header,
.base hgroup,
.base html,
.base i,
.base iframe,
.base img,
.base ins,
.base kbd,
.base label,
.base legend,
.base li,
.base mark,
.base menu,
.base nav,
.base object,
.base ol,
.base output,
.base p,
.base pre,
.base q,
.base ruby,
.base s,
.base samp,
.base section,
.base small,
.base span,
.base strike,
.base strong,
.base sub,
.base summary,
.base sup,
.base table,
.base tbody,
.base td,
.base tfoot,
.base th,
.base thead,
.base time,
.base tr,
.base tt,
.base u,
.base ul,
.base var,
.base video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  line-height: 1;
}
.base article,
.base aside,
.base details,
.base figcaption,
.base figure,
.base footer,
.base header,
.base menu,
.base nav,
.base section {
  display: block;
}
.base body {
  line-height: 1;
}
.base ol,
.base ul {
  list-style: none;
  margin: 0;
}
.base blockquote,
.base q {
  quotes: none;
}
.base blockquote:after,
.base blockquote:before,
.base q:after,
.base q:before {
  content: "";
  content: none;
}
.base table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* 【變數】 */
:root {
  --root: 16px;
  --wh: #fff;
  --vanta: #000;
  --cht-header: 116px;
}

/* 【樣式】 */
*,
html {
  box-sizing: border-box;
  font-size: var(--root);
}

img {
  vertical-align: bottom;
}

[hidden],
[omitted] {
  display: none !important;
}

[pc] {
  display: block;
}

[mb] {
  display: none !important;
}

.rwd,
[rwd] {
  width: 100%;
}

dl,
ol,
ul {
  margin-bottom: 0;
}

.nav-sec {
  position: absolute;
  left: 50%;
  width: max-content;
  transform: translateX(-50%);
  display: none;
}

.nav-sec:hover {
  display: block;
}

.nav-sec a {
  position: absolute;
  left: 0;
  width: 100%;
  height: 33.34%;
}

.nav-sec a:nth-of-type(1) {
  top: 0;
}

.nav-sec a:nth-of-type(2) {
  top: 33.33%;
}

.nav-sec a:nth-of-type(3) {
  top: 66.66%;
}

.base {
  --indigo: #02339a;
  --aqua: #2aabe4;
  --tb-bdr: #cecece;
  font-family:
    "Noto Sans TC", "微軟正黑體", "Microsoft Jhenghei", "SF Pro TC",
    "PingFang TC", Arial, sans-serif;
  background: rgb(108, 182, 255);
  background: #e2f3fb;
}

.base .box {
}

.base .box .main-title {
  display: block;
  width: 60%;
  margin: 0 auto;
  padding: 2vw 0;
}

.base section + section {
  margin-top: 0.5vw;
}
.base .aligner {
  margin: 0 auto;
  width: 67.7vw;
}
.base .frame {
  border-radius: 2.6vw;
  padding: 1vw;
}
.base .frame .fr-ctn {
  --naming: "frame-container";
  /* 卡片右下漸層陰影：.frame 有 padding，陰影加在 .fr-ctn 才會貼齊卡片邊緣 */
  border-radius: 2.6vw 2.6vw 1.9vw 1.9vw;
  box-shadow:
    0.5vw 0.6vw 0.9vw rgba(90, 150, 200, 0.35),
    0.2vw 0.25vw 0.3vw rgba(90, 150, 200, 0.2);
}
.base .frame .fr-ctn article {
  text-align: center;
  background: var(--wh);
  width: 100%;
  border-radius: 0 0 1.9vw 1.9vw;
  color: var(--vanta);
  overflow: hidden;
}

.base .frame .fr-ctn article .terms-title-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 90%;
  margin: 3vw auto 1vw;
}

.base .frame .fr-ctn article em {
  font-weight: 900;
  font-size: 2vw;
  line-height: 1.5;
  display: block;
  text-align: center;
  margin: 1.2vw auto;
}

.base .frame .fr-ctn article p {
  font-weight: 700;
  font-size: 1.35vw;
  line-height: 1.5;
  display: block;
  text-align: left;
}

.base .frame .fr-ctn article p {
  font-weight: 400;
}
.base .frame .fr-ctn article ul + em {
  margin-top: 2em;
}
.base .frame .fr-ctn article ul {
  width: 85%;
  margin: auto;
  text-align: left;
}
.base .frame .fr-ctn article ul li {
  list-style-type: decimal;
  list-style-position: outside;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.5;
}
.base .frame .fr-ctn article ul li a {
  text-decoration: underline;
  color: var(--aqua);
}
.base .frame .fr-ctn article ul li sub {
  display: inline-block;
  font-size: 0.7vw;
}
.base .frame .fr-ctn article ul li footer {
  font-size: 0.7vw;
  padding: 0.25em 0;
}
.base .frame .fr-ctn article ul li table {
  border-collapse: collapse;
  border: 1px solid var(--tb-bdr);
  border-width: 1px 0 0 1px;
  margin: 0.25em 0;
}
.base .frame .fr-ctn article ul li table th,
.base .frame .fr-ctn article ul li table td {
  border: 1px solid var(--tb-bdr);
  border-width: 0 1px 1px 0;
  padding: 0.3em;
  line-height: 1.5;
  text-align: center;
}
.base .frame .fr-ctn article ul li table td:not([class]) {
  width: 3%;
}
.base .frame .fr-ctn article ul li table .cate {
  width: 18%;
  font-weight: 700;
}
.base .frame .fr-ctn article ul li table .gift {
  text-align: left;
}

.base .frame .gift-banner {
  background-image: url("../imgs/award-banner.png");
  background-size: 100%;
  width: 100%;
  aspect-ratio: 1300 / 745;
  margin: auto;
  background-position: center;
  background-repeat: no-repeat;
}
.base .frame .fr-ctn article ul li table .gift strong {
  font-weight: 700;
  display: block;
}
.base .frame .fr-ctn article ul li table .gift mark {
  background: transparent;
  font-size: max(12px, 0.8vw);
}
.base .frame .fr-ctn article ul li table .price {
  width: 10%;
}
.base .frame .fr-ctn article ul li table .qty {
  width: 10%;
}
.base .frame .fr-ctn article ul li table thead th {
  background: #ececec;
}
.base .frame .fr-ctn article ul li table tbody {
  --name: "";
}
.base .frame .fr-ctn article ul li .list {
  position: relative;
  display: flex;
  line-height: 1.5;
}
.base .frame .fr-ctn article ul li .list .affix {
  position: absolute;
  display: grid;
  place-items: center;
  width: 1em;
  height: 1em;
  top: 0.275em;
}
.base .frame .fr-ctn article ul li .list blockquote {
  padding-left: 1.3em;
  line-height: 1.5;
}
.base .frame .fr-ctn article ul li .list blockquote strong {
  font-weight: 700;
}
.base .frame .fr-ctn article ul li .list.bullet .affix::before {
  content: "";
  width: 0.3em;
  height: 0.3em;
  border-radius: 100%;
  background: var(--vanta);
}
.base .frame .fr-ctn article ul li .list.check .affix::before {
  content: "";
  width: 1em;
  height: 1em;
  background: url(../imgs/icon_check.svg) center/cover no-repeat;
}
.base .frame .fr-ctn article ul li dl {
  position: relative;
  display: flex;
  flex-direction: row;
}
.base .frame .fr-ctn article ul li dl dt,
.base .frame .fr-ctn article ul li dl dd {
  line-height: 1.5;
}
.base .frame .fr-ctn article ul li dl dt {
  position: absolute;
}
.base .frame .fr-ctn article ul li dl dd {
  padding-left: 1.3em;
}
.base .frame .fr-ctn article[role="img"] {
  max-height: unset;
  padding: 0;
}
.base .frame .fr-ctn article[role="img"] img {
  vertical-align: bottom;
}
.base .frame .fr-ctn .bellow {
}

.base .frame .fr-ctn .bellow p {
  width: 95%;
  margin: auto;
  font-size: 1.5rem;
  font-weight: 900;
  text-align: center;
  padding: 1.5vw;
  line-height: 1.5;
}

.base .frame .fr-ctn.bellow1 p {
  width: 80%;
}

.base .frame .fr-ctn .bellow2-1 {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.base .frame .fr-ctn .bellow2-1 .inner-title {
  color: #003399;
  font-size: 2.3rem;
  font-weight: bold;
  padding: 1.5rem 0 0.5rem;
}

.base .frame .fr-ctn .bellow2-1 p {
  padding-top: 0;
}

/* 活動時間／現場活動 條列 */
.base .frame .fr-ctn article .event-list {
  width: fit-content;
  max-width: 92%;
  margin: 0 auto;
  padding: 1.5rem 0 2rem;
  list-style: none;
  text-align: left;
}
.base .frame .fr-ctn article .event-list-time {
  padding-top: 0.5rem;
}
.base .frame .fr-ctn article .event-list li {
  display: flex;
  align-items: baseline;
  gap: 0 0.6em;
  font-size: 1rem;
  line-height: 1.6;
  list-style-type: none;
  margin-bottom: 0.7em;
}
.base .frame .fr-ctn article .event-list li:last-child {
  margin-bottom: 0;
}
.base .frame .fr-ctn article .event-list .ev-num {
  flex-shrink: 0;
  min-width: 1.4em;
  font-size: 1.6rem;
  font-weight: 900;
}
.base .frame .fr-ctn article .event-list-time .ev-num {
  min-width: 3.2em;
}
.base .frame .fr-ctn article .event-list .ev-title {
  flex-shrink: 0;
  font-size: 1.6rem;
  font-weight: 900;
  white-space: nowrap;
}
.base .frame .fr-ctn article .event-list .ev-desc {
  font-size: 1.1rem;
  font-weight: 500;
}

@media screen and (max-width: 1200px) {
  .base .frame .fr-ctn article .event-list .ev-num,
  .base .frame .fr-ctn article .event-list .ev-title {
    font-size: 1.3rem;
  }
  .base .frame .fr-ctn article .event-list .ev-desc {
    font-size: 1rem;
  }
}

/* 進場方式與注意事項 */
.base .frame .fr-ctn .bellow3 {
  border-radius: 0 0 1.9vw 1.9vw;
}
.base .frame .fr-ctn article .notice-list {
  width: 100%;
  margin: 0;
  padding: 2rem 4% 2.5rem;
  list-style: none;
  text-align: left;
}
.base .frame .fr-ctn article .notice-list > li {
  font-size: 1rem;
  line-height: 1.7;
  list-style-type: none;
  margin-bottom: 1rem;
}
.base .frame .fr-ctn article .notice-list > li:last-child {
  margin-bottom: 0;
}
.base .frame .fr-ctn article .notice-list .nt-head {
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1.5;
  margin-bottom: 0.3rem;
}
.base .frame .fr-ctn article .notice-list .nt-num {
  display: inline-block;
  min-width: 1.6em;
  font-weight: 900;
}
.base .frame .fr-ctn article .notice-list .nt-sub {
  width: auto;
  margin: 0 0 0 1.6rem;
  list-style: none;
}
.base .frame .fr-ctn article .notice-list .nt-sub li {
  position: relative;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.7;
  list-style-type: none;
  padding-left: 2.2em;
  margin-bottom: 0.2em;
}
.base .frame .fr-ctn article .notice-list .nt-sub-num {
  position: absolute;
  left: 0;
  top: 0;
}
.base .frame .fr-ctn article .notice-list .nt-text {
  width: auto;
  margin: 0 0 0 2.4rem;
  padding: 0;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.7;
  text-align: left;
}
/* 5. 沒有標題：編號與內文同一列，內文懸掛縮排 */
.base .frame .fr-ctn article .notice-list .nt-plain {
  position: relative;
  padding-left: 2.4rem;
}
.base .frame .fr-ctn article .notice-list .nt-plain .nt-num {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1.5rem;
  line-height: 1.15;
}
.base .frame .fr-ctn article .notice-list .nt-plain .nt-text {
  margin-left: 0;
}

/* 查看更多優惠（在 section 外面，不在 .frame 裡） */
/* 按鈕是最後一個元素，margin-bottom 會穿出 .content 變成背景外的白色空白，
   所以底部留白改用 .content 的 padding-bottom */
.base .content {
  padding-bottom: 5vw;
}
.base .more-btn {
  display: block;
  width: 26vw;
  margin: 3.5vw auto 0;
  transition: transform 0.2s;
}
.base .more-btn img {
  display: block;
  width: 100%;
  height: auto;
}
.base .more-btn:hover {
  transform: translateY(-3px);
}

@media screen and (max-width: 750px) {
  .base .content {
    padding-bottom: 12vw;
  }
  .base .more-btn {
    width: 65vw;
    margin: 8vw auto 0;
  }
}

.base .frame .fr-ctn .title3 {
  width: 45%;
  height: auto;
}

.base .frame .fr-ctn article .rule-label {
  font-size: 1.4rem;
  font-weight: 900;
  text-align: left;
  white-space: nowrap;
}

.base .frame .fr-ctn article .rule-label:empty {
  text-align-last: left;
}

.base .frame .fr-ctn article .rule-content {
  font-size: 1.5rem;
  font-weight: 500;
  text-align: left;
}
.base .frame .fr-ctn article .rule-content.rule-body-title {
  font-size: 1.6rem;
  white-space: nowrap;
}

.base .frame .fr-ctn article .rule-content p {
  font-size: inherit;
  font-weight: inherit;
  margin: 0 0 0.6em;
}
.base .frame .fr-ctn article .rule-content p:last-child {
  margin-bottom: 0;
}

.base .frame .fr-ctn article .rule-content p.rule-num-item {
  position: relative;
  padding-left: 2em;
}

.base .frame .fr-ctn article .rule-content p.rule-num-item-sublist {
  padding-left: 4em;
}
.base .frame .fr-ctn article .rule-num-item .rule-num {
  position: absolute;
  left: 0;
  top: 0;
}

.base .frame .fr-ctn article .rule-sublist {
  width: auto;
  margin: 0 0 0.6em;
  list-style: none;
}
.base .frame .fr-ctn article .rule-sublist li {
  position: relative;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1.5;
  list-style-type: none;
  padding-left: 1.1em;
  margin-bottom: 0.4em;
}
.base .frame .fr-ctn article .rule-sublist li:last-child {
  margin-bottom: 0;
}
.base .frame .fr-ctn article .rule-sublist li::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}

.base .frame .fr-ctn article .rule-dot-list,
.base .frame .fr-ctn article .rule-check-list,
.base .frame .fr-ctn article .rule-alpha-list {
  width: auto;
  list-style: none;
  margin: 0 0 0.6em;
}
.base .frame .fr-ctn article .rule-dot-list li,
.base .frame .fr-ctn article .rule-check-list li,
.base .frame .fr-ctn article .rule-alpha-list li {
  position: relative;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1.5;
  list-style-type: none;
  margin-bottom: 0.4em;
}
.base .frame .fr-ctn article .rule-dot-list li:last-child,
.base .frame .fr-ctn article .rule-check-list li:last-child,
.base .frame .fr-ctn article .rule-alpha-list li:last-child {
  margin-bottom: 0;
}

.base .frame .fr-ctn article .rule-dot-list {
  margin-left: 2em;
}
.base .frame .fr-ctn article .rule-dot-list li {
  font-weight: 700;
  padding-left: 1.2em;
}
.base .frame .fr-ctn article .rule-dot-list li::before {
  content: "●";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 0.7em;
}

.base .frame .fr-ctn article .rule-check-list {
  margin-left: 3.2em;
}
.base .frame .fr-ctn article .rule-check-list li {
  padding-left: 1.4em;
}
.base .frame .fr-ctn article .rule-check-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
}

.base .frame .fr-ctn article .rule-alpha-list {
  margin-left: 2em;
}
.base .frame .fr-ctn article .rule-alpha-list li {
  padding-left: 1.6em;
}
.base .frame .fr-ctn article .rule-alpha-list .rule-alpha {
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 700;
}

.base h2[role="heading"] {
  font-size: 3.1vw;
  font-weight: 900;
  color: var(--wh);
  text-align: center;
  letter-spacing: 0.567em;
  padding: 0.6vw 0;
  border-radius: 2.6vw 2.6vw 0 0;
  background-color: #fde9b8;
}
.base h2[role="heading"] img {
  width: 20vw;
}
.base .kv {
  position: relative;
}
.base .kv img {
  position: relative;
  z-index: 1;
}

.base .kv .btn-menu {
  display: none;
}
.base .notice .aligner {
  padding-bottom: 4vw;
}
section#footer {
  position: relative;
  z-index: 1;
}

@media screen and (min-width: 1650px) {
  .base .aligner {
    max-width: 67.7vw;
  }

  /* 卡片寬度隨 vw 放大，內文也改用 vw 等比放大，避免兩側留白過多（比例依設計稿） */
  /* 活動簡介 */
  .base .frame .fr-ctn .bellow1 p {
    font-size: 1.5vw;
    padding: 1.8vw 0 2vw;
  }

  /* 活動時間 日期標題 */
  .base .frame .fr-ctn .bellow2-1 .inner-title {
    font-size: 2.3vw;
    padding: 1.4vw 0 0.6vw;
  }

  /* 活動時間／現場活動 條列 */
  .base .frame .fr-ctn article .event-list {
    padding: 1.6vw 0 2vw;
  }
  .base .frame .fr-ctn article .event-list-time {
    padding-top: 0.4vw;
  }
  .base .frame .fr-ctn article .event-list li {
    font-size: 1.07vw;
  }
  .base .frame .fr-ctn article .event-list .ev-num,
  .base .frame .fr-ctn article .event-list .ev-title {
    font-size: 1.55vw;
  }
  .base .frame .fr-ctn article .event-list .ev-desc {
    font-size: 1.07vw;
  }

  /* 進場方式與注意事項 */
  .base .frame .fr-ctn article .notice-list {
    padding: 2vw 4% 2.5vw;
  }
  .base .frame .fr-ctn article .notice-list > li {
    font-size: 1.07vw;
    margin-bottom: 1vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-head,
  .base .frame .fr-ctn article .notice-list .nt-plain .nt-num {
    font-size: 1.55vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-sub {
    margin-left: 1.6vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-sub li,
  .base .frame .fr-ctn article .notice-list .nt-text {
    font-size: 1.07vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-text {
    margin-left: 2.5vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-plain {
    padding-left: 2.5vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-plain .nt-text {
    margin-left: 0;
  }
}

@media screen and (min-width: 920px) and (max-width: 1200px) {
  .base .frame .fr-ctn article .rule-container {
    --rule-label-w: 11vw;
  }

  .base .frame .fr-ctn article .rule-label,
  .base .frame .fr-ctn article .rule-content.rule-body-title {
    font-size: 1rem;
  }

  .base .frame .fr-ctn article .rule-content,
  .base .frame .fr-ctn article ul li {
    font-size: 1rem;
  }
}

@media screen and (min-width: 1200px) and (max-width: 1750px) {
  .base .frame .fr-ctn .bellow {
  }

  .base .frame .fr-ctn article .rule-container {
    --rule-label-w: 11vw;
  }

  .base .frame .fr-ctn article .rule-label,
  .base .frame .fr-ctn article .rule-content.rule-body-title {
    font-size: 1.3rem;
  }

  .base .frame .fr-ctn article .rule-content,
  .base .frame .fr-ctn article ul li {
    font-size: 1.3rem;
  }
}

@media screen and (min-width: 767px) and (max-width: 920px) {
  .base .aligner {
    width: 85vw;
  }

  .base .frame .fr-ctn .bellow {
  }

  .base .frame .fr-ctn article .rule-container {
    --rule-label-w: 15vw;
  }

  .base .frame .fr-ctn article .rule-label,
  .base .frame .fr-ctn article .rule-content.rule-body-title {
    font-size: 1.1rem;
  }

  .base .frame .fr-ctn article .rule-content {
    font-size: 1.1rem;
  }

  .base .frame .fr-ctn article ul li {
    font-size: 1.1rem;
  }

  .base .frame .fr-ctn .bellow#bellow-notice {
  }
}

/* 【MEDIA QUERIES】 */
@media screen and (max-width: 750px) {
  [pc] {
    display: none !important;
  }
  [mb] {
    display: block !important;
  }

  .nav-sec {
    width: 30vw;
  }
  .base .kv::after {
    display: none;
  }

  .base .box .main-title {
    width: 90%;
    padding: 4vw 0;
  }

  .base section + section {
    margin-top: 0;
  }
  .base .aligner {
    margin: 0 auto;
    width: 94.7vw;
  }
  .base .frame {
    border-radius: 6.7vw;
    padding: 2.7vw;
  }
  .base .frame .fr-ctn article {
    border-radius: 0 0 4.8vw 4.8vw;
  }
  .base .frame .fr-ctn article em,
  .base .frame .fr-ctn article p {
    font-size: 2.7vw;
  }
  .base .frame .fr-ctn article ul li {
    font-size: 2.7vw;
  }
  .base .frame .fr-ctn article ul li sub,
  .base .frame .fr-ctn article ul li footer {
    font-size: 70%;
    line-height: 1.5;
  }
  .base .frame .fr-ctn .bellow {
  }
  .base .frame .fr-ctn .bellow2-1 .inner-title {
    font-size: 1.2rem;
  }

  .base .frame .fr-flex {
    flex-direction: column;
    gap: 3.3vw 0;
  }
  .base .frame .fr-item {
    width: 100%;
    border-radius: 4vw;
  }
  .base h2[role="heading"] {
    font-size: 7.5vw;
    text-shadow:
      0 0 2.4vw rgba(0, 153, 204, 0.9),
      0 0 2.7vw rgba(0, 153, 204, 0.9),
      0 0 2.9vw rgba(0, 153, 204, 0.8);
  }
  .base .kv img[role="heading"] {
    position: relative;
    z-index: 1;
  }
  .base .kv .btn-menu {
    display: block;
    position: absolute;
    z-index: 101;
    top: 5.7vw;
    right: 4.9vw;
    width: 9.3vw;
    height: 8vw;
    cursor: pointer;
    appearance: none;
    background: transparent;
    border: none;
    line-height: 1;
    place-items: center;
  }
  .base .frame .fr-ctn .bellow p {
    font-size: 0.8rem;
  }
  .base h2[role="heading"] img {
    width: 40vw;
  }
  .base .heading4[role="heading"] img {
    width: 70vw;
  }
  .base .kv .btn-menu img {
    width: 100%;
  }
  .base .kv .btn-menu .btn-cross {
    display: none;
  }
  .base .kv .btn-menu.opened .btn-lines {
    display: none;
  }
  .base .kv .btn-menu.opened .btn-cross {
    display: block;
  }
  .base .rule {
    position: relative;
    z-index: 3;
  }
  .base .notice .aligner {
    padding-bottom: 7vw;
  }
  .base .frame .fr-ctn article .rule-label,
  .base .frame .fr-ctn article .rule-content.rule-body-title {
    font-size: 0.65rem;
  }
  .base .frame .fr-ctn article .rule-content {
    font-size: 0.65rem;
  }
}

@media screen and (max-width: 420px) {
  .base .frame .fr-ctn article .rule-label,
  .base .frame .fr-ctn article .rule-content.rule-body-title,
  .base .frame .fr-ctn article .rule-content {
    font-size: 0.6rem;
  }
}

/* reset 讓所有 span 都是 line-height: 1，條列裡的 span 要吃 li 的行高，
   否則多行說明會擠在一起、(1) 編號會往上跑 */
.base .frame .fr-ctn article .event-list li span,
.base .frame .fr-ctn article .notice-list span {
  line-height: inherit;
}

/* 【手機版】活動簡介／活動時間／現場活動／進場方式與注意事項（依設計稿）
   放在檔案最後，才能蓋過上方 750px 區塊裡同權重的 .bellow p、.inner-title */
@media screen and (max-width: 750px) {
  /* 活動簡介 */
  .base .frame .fr-ctn .bellow1 p {
    width: 100%;
    font-size: 3.2vw;
    font-weight: 900;
    line-height: 1.8;
    padding: 4vw 2vw 4.5vw;
  }

  /* 活動時間 日期標題 */
  .base .frame .fr-ctn .bellow2-1 .inner-title {
    font-size: 5vw;
    font-weight: 900;
    padding: 4vw 0 1vw;
  }

  /* 活動時間／現場活動：標題一行，說明在下一行 */
  .base .frame .fr-ctn article .event-list {
    width: 100%;
    max-width: none;
    padding: 3vw 5vw 5vw;
  }
  .base .frame .fr-ctn article .event-list-time {
    padding-top: 2vw;
  }
  .base .frame .fr-ctn article .event-list li {
    display: block;
    font-size: 3.4vw;
    line-height: 1.6;
    margin-bottom: 2.4vw;
  }
  .base .frame .fr-ctn article .event-list .ev-num,
  .base .frame .fr-ctn article .event-list-time .ev-num {
    display: inline;
    min-width: 0;
    margin-right: 0.3em;
    font-size: 4.2vw;
    line-height: 1.5;
  }
  .base .frame .fr-ctn article .event-list:not(.event-list-time) .ev-num {
    margin-right: 0;
  }
  .base .frame .fr-ctn article .event-list .ev-title {
    display: inline;
    font-size: 4.2vw;
    line-height: 1.5;
    white-space: normal;
  }
  .base .frame .fr-ctn article .event-list .ev-desc {
    display: block;
    font-size: 3.4vw;
    font-weight: 400;
    line-height: 1.6;
    margin-top: 0.5vw;
  }
  /* 現場活動的說明內縮 */
  .base .frame .fr-ctn article .event-list:not(.event-list-time) .ev-desc {
    padding-left: 4.2vw;
  }
  .base .frame .fr-ctn article .event-list .ev-desc br {
    display: none;
  }

  /* 進場方式與注意事項 */
  .base .frame .fr-ctn .bellow3 {
    border-radius: 0 0 4.8vw 4.8vw;
  }
  /* 卡片右下漸層陰影（手機） */
  .base .frame .fr-ctn {
    border-radius: 2.6vw 2.6vw 4.8vw 4.8vw;
    box-shadow:
      1vw 1.2vw 1.6vw rgba(90, 150, 200, 0.35),
      0.4vw 0.5vw 0.6vw rgba(90, 150, 200, 0.2);
  }
  .base .frame .fr-ctn article .notice-list {
    padding: 4vw 5vw 6vw;
  }
  .base .frame .fr-ctn article .notice-list > li {
    font-size: 3.4vw;
    margin-bottom: 2.4vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-head {
    font-size: 4.2vw;
    line-height: 1.5;
    margin-bottom: 0.5vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-num {
    min-width: 1.4em;
  }
  .base .frame .fr-ctn article .notice-list .nt-sub {
    margin-left: 3vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-sub li {
    font-size: 3.4vw;
    font-weight: 400;
    line-height: 1.6;
    padding-left: 1.9em;
    margin-bottom: 0.5vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-text {
    font-size: 3.4vw;
    font-weight: 400;
    line-height: 1.6;
    margin-left: 6vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-plain {
    padding-left: 6vw;
  }
  .base .frame .fr-ctn article .notice-list .nt-plain .nt-num {
    min-width: 0;
    font-size: 4.2vw;
    line-height: 1.3;
  }
  .base .frame .fr-ctn article .notice-list .nt-plain .nt-text {
    margin-left: 0;
  }
}