{"id":20,"date":"2026-05-22T22:10:12","date_gmt":"2026-05-22T14:10:12","guid":{"rendered":"https:\/\/fiveartsassociation.org\/?page_id=20"},"modified":"2026-05-23T19:39:11","modified_gmt":"2026-05-23T11:39:11","slug":"%e9%a6%96%e9%a0%81","status":"publish","type":"page","link":"https:\/\/fiveartsassociation.org\/","title":{"rendered":"\u9996\u9801"},"content":{"rendered":"\n<meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=yes\">\n  <meta name=\"description\" content=\"\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703\u70ba\u5167\u653f\u90e8\u6838\u51c6\u7acb\u6848\u4e4b\u793e\u6703\u5718\u9ad4\uff0c\u63a8\u5ee3\u4e94\u8853\u6587\u5316\u4ea4\u6d41\u3001\u547d\u7406\u77e5\u8b58\u6559\u80b2\u3001\u98a8\u6c34\u5be6\u52d9\u5206\u4eab\u3001\u64c7\u65e5\u61c9\u7528\u8207\u59d3\u540d\u5b78\u7814\u7a76\u3002\">\n  <meta name=\"keywords\" content=\"\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703, \u4e94\u8853, \u547d\u7406, \u98a8\u6c34, \u64c7\u65e5, \u59d3\u540d\u5b78, \u5354\u6703, \u6559\u5b78, \u6d3b\u52d5\">\n  <meta name=\"author\" content=\"\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703\">\n  <meta property=\"og:title\" content=\"\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703\">\n  <meta property=\"og:description\" content=\"\u63a8\u5ee3\u4e94\u8853\u6587\u5316\u4ea4\u6d41\u3001\u547d\u7406\u77e5\u8b58\u6559\u80b2\u3001\u98a8\u6c34\u5be6\u52d9\u5206\u4eab\u8207\u5c08\u696d\u8b1b\u5ea7\u6d3b\u52d5\u3002\">\n  <meta property=\"og:type\" content=\"website\">\n  <title>\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703\uff5c\u5b98\u65b9\u7db2\u7ad9<\/title>\n  <link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.css\">\n  <style>\n    :root {\n      --bg: #f7ead0;\n      --surface: rgba(255, 249, 236, 0.84);\n      --surface-2: rgba(255, 236, 179, 0.56);\n      --primary: #8b1e1e;\n      --primary-dark: #5f1010;\n      --accent: #d4af37;\n      --accent-2: #f2c94c;\n      --ink: #101010;\n      --text: #1a1410;\n      --muted: #2b211b;\n      --muted-soft: #4a3b2f;\n      --line: rgba(139, 30, 30, 0.16);\n      --shadow: 0 18px 42px rgba(37, 21, 8, 0.18);\n      --glass: rgba(255, 250, 236, 0.86);\n      --glass-strong: rgba(255, 250, 236, 0.92);\n      --radius: 24px;\n      --radius-sm: 16px;\n      --container: 1180px;\n    }\n\n    * { box-sizing: border-box; }\n    html { scroll-behavior: smooth; }\n    body {\n      margin: 0;\n      font-family: \"Noto Sans TC\", \"PingFang TC\", \"Microsoft JhengHei\", Arial, sans-serif;\n      color: var(--text);\n      background:\n        radial-gradient(circle at top left, rgba(212, 175, 55, 0.20), transparent 26%),\n        radial-gradient(circle at top right, rgba(139, 30, 30, 0.12), transparent 24%),\n        linear-gradient(180deg, #fff8ea 0%, var(--bg) 100%);\n      overflow-x: hidden;\n    }\n\n    a { color: inherit; text-decoration: none; }\n    img { max-width: 100%; display: block; }\n\n    .fade-up {\n      opacity: 0;\n      transform: translateY(24px);\n      transition: opacity 0.65s cubic-bezier(0.2, 0.9, 0.3, 1.1), transform 0.65s ease;\n    }\n    .fade-up.visible {\n      opacity: 1;\n      transform: translateY(0);\n    }\n\n    @keyframes softPulse {\n      0% { text-shadow: 0 0 0px rgba(212,175,55,0); opacity: 0.9; }\n      50% { text-shadow: 0 0 6px rgba(212,175,55,0.5); opacity: 1; }\n      100% { text-shadow: 0 0 0px rgba(212,175,55,0); opacity: 0.9; }\n    }\n    .typewriter {\n      font-size: 1.1rem;\n      font-weight: 500;\n      color: var(--primary-dark);\n      background: rgba(255,245,214,0.75);\n      backdrop-filter: blur(4px);\n      padding: 6px 16px;\n      border-radius: 40px;\n      display: inline-block;\n      margin-top: 12px;\n      border-left: 4px solid var(--accent);\n    }\n    .typewriter .typed-cursor {\n      display: inline-block;\n      width: 2px;\n      background-color: var(--primary);\n      margin-left: 4px;\n      animation: blink 1s infinite;\n    }\n    @keyframes blink {\n      0%, 100% { opacity: 1; }\n      50% { opacity: 0; }\n    }\n\n    .container {\n      width: min(100% - 32px, var(--container));\n      margin: 0 auto;\n    }\n\n    \/* \u52d5\u614b\u6d88\u606f\u8dd1\u99ac\u71c8 (\u5782\u76f4\u5207\u63db\u52a0\u5f37) *\/\n    .dynamic-news {\n      background: rgba(0,0,0,0.55);\n      backdrop-filter: blur(8px);\n      border-radius: 60px;\n      padding: 8px 18px;\n      display: inline-flex;\n      align-items: center;\n      gap: 12px;\n      font-weight: 500;\n      margin-top: 18px;\n    }\n    .news-icon {\n      background: var(--accent);\n      color: #2c1a0c;\n      border-radius: 40px;\n      padding: 4px 12px;\n      font-size: 12px;\n      font-weight: 800;\n      animation: softPulse 1.8s infinite;\n    }\n    .rolling-text {\n      color: #fff5e6;\n      font-size: 14px;\n      transition: opacity 0.25s;\n    }\n\n    \/* \u9996\u5c4f hero \u5340\u57df - \u4e0a\u5167\u908a\u8ddd\u5df2\u7e2e\u5c0f\uff0c\u8b93\u9802\u90e8\u8ddd\u96e2\u66f4\u7dca\u6e4a *\/\n    .hero {\n      padding: 1.5rem 0 34px;\n    }\n    .hero-grid {\n      display: grid;\n      grid-template-columns: 1.1fr 0.9fr;\n      gap: 28px;\n      align-items: center;\n    }\n    .eyebrow {\n      display: inline-flex;\n      align-items: center;\n      gap: 10px;\n      padding: 8px 14px;\n      border-radius: 999px;\n      background: rgba(255, 243, 198, 0.82);\n      color: var(--primary-dark);\n      font-weight: 700;\n      font-size: 14px;\n      margin-bottom: 18px;\n      border: 1px solid rgba(212,175,55,0.3);\n      backdrop-filter: blur(8px);\n    }\n    .hero h2 {\n      margin: 0;\n      font-size: clamp(34px, 5vw, 62px);\n      line-height: 1.08;\n      color: var(--ink);\n    }\n    .hero h2 span {\n      color: var(--primary);\n    }\n    .hero p {\n      margin: 18px 0 0;\n      font-size: 18px;\n      line-height: 1.9;\n      color: var(--muted);\n      font-weight: 500;\n      max-width: 40rem;\n    }\n    .hero-actions {\n      display: flex;\n      gap: 14px;\n      flex-wrap: wrap;\n      margin-top: 28px;\n    }\n    .btn {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      padding: 14px 20px;\n      border-radius: 16px;\n      font-weight: 700;\n      transition: 0.2s ease;\n      min-height: 52px;\n      backdrop-filter: blur(12px);\n    }\n    .btn-primary {\n      background: linear-gradient(135deg, #1a1a1a, var(--primary-dark));\n      color: #fff;\n      box-shadow: 0 18px 30px rgba(37,21,8,0.22);\n    }\n    .btn-primary:hover { transform: translateY(-2px); filter: brightness(1.02);}\n    .btn-secondary {\n      background: rgba(255,245,214,0.82);\n      border: 1px solid rgba(212,175,55,0.4);\n      color: var(--text);\n    }\n\n    .hero-card {\n      background: var(--glass-strong);\n      border: 1px solid rgba(212,175,55,0.25);\n      border-radius: 30px;\n      box-shadow: var(--shadow);\n      padding: 20px;\n      backdrop-filter: blur(18px);\n    }\n    .hero-visual {\n      height: 360px;\n      border-radius: 24px;\n      background: linear-gradient(145deg, rgba(139,30,30,0.92), rgba(15,15,15,0.98));\n      position: relative;\n      overflow: hidden;\n      display: flex;\n      align-items: end;\n      padding: 22px;\n      color: #fff;\n    }\n    .hero-photo {\n      position: absolute;\n      inset: 0;\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n      opacity: 0.25;\n    }\n    .hero-visual-title {\n      font-size: 28px;\n      font-weight: 800;\n      text-shadow: 0 2px 10px rgba(0,0,0,0.5);\n    }\n    .dynamic-slogan {\n      background: rgba(0,0,0,0.55);\n      border-radius: 60px;\n      padding: 6px 16px;\n      backdrop-filter: blur(12px);\n      font-size: 14px;\n      font-weight: 600;\n      display: inline-flex;\n      align-items: center;\n      gap: 10px;\n      margin-top: 8px;\n      border-left: 4px solid var(--accent);\n    }\n    .slogan-text {\n      transition: opacity 0.3s;\n    }\n    .floating-stats {\n      display: grid;\n      grid-template-columns: repeat(3, 1fr);\n      gap: 12px;\n      margin-top: 18px;\n    }\n    .stat {\n      background: rgba(255,247,224,0.88);\n      border-radius: 18px;\n      padding: 12px 8px;\n      text-align: center;\n      backdrop-filter: blur(8px);\n    }\n    .stat strong {\n      display: block;\n      font-size: 28px;\n      color: var(--primary);\n      font-weight: 800;\n    }\n    .stat span {\n      font-size: 13px;\n      color: var(--muted);\n      font-weight: 600;\n    }\n\n    \/* \u7406\u4e8b\u9577\u7834\u683c\u5340\u584a - \u5b8c\u5168\u7121\u5916\u6846 *\/\n    .founder-breakout {\n      overflow: visible !important;\n      position: relative;\n      z-index: 2;\n      background: transparent;\n      backdrop-filter: none;\n      box-shadow: none;\n      padding: 0;\n    }\n    .breakout-wrapper {\n      position: relative;\n      width: 100%;\n      display: flex;\n      justify-content: center;\n      margin: -20px 0 -30px 0;\n      z-index: 5;\n    }\n    .breakout-img {\n      width: 92%;\n      max-width: 420px;\n      aspect-ratio: 4 \/ 5;\n      object-fit: contain;\n      object-position: center 10%;\n      border-radius: 28px 28px 24px 24px;\n      \/* \u79fb\u9664\u6240\u6709\u5916\u6846\u3001\u9670\u5f71\u3001\u908a\u6846\u3001\u6ffe\u93e1 *\/\n      box-shadow: none;\n      filter: none;\n      border: none;\n      background: transparent;\n      transform: scale(1.02) translateY(-12px);\n      transition: transform 0.35s cubic-bezier(0.2, 0.9, 0.4, 1.1);\n    }\n    .founder-breakout:hover .breakout-img {\n      transform: scale(1.04) translateY(-16px);\n    }\n    .founder-text-card {\n      position: relative;\n      z-index: 3;\n      background: var(--glass);\n      backdrop-filter: blur(16px);\n      margin-top: 20px;\n    }\n\n    \/* \u5176\u4ed6\u5361\u7247\u8207\u5143\u4ef6 *\/\n    .card p, .timeline-item p, .feature-slider-card p, .hero p, .hero-visual-sub {\n      color: var(--muted);\n      font-weight: 500;\n      line-height: 1.7;\n    }\n    .card h4, .timeline-item h4 {\n      color: var(--ink);\n      font-weight: 700;\n    }\n    .meta, .pill {\n      color: var(--primary-dark);\n      font-weight: 700;\n    }\n\n    .swiper {\n      border-radius: 28px;\n      padding: 8px 4px 32px;\n    }\n    .swiper-button-next, .swiper-button-prev {\n      color: var(--primary-dark);\n      background: rgba(255,245,200,0.8);\n      backdrop-filter: blur(8px);\n      width: 42px;\n      height: 42px;\n      border-radius: 50%;\n    }\n    .feature-slider-card {\n      background: var(--glass-strong);\n      border-radius: 24px;\n      padding: 18px;\n      backdrop-filter: blur(16px);\n      border: 1px solid rgba(212,175,55,0.25);\n    }\n    .feature-slider-card img {\n      border-radius: 18px;\n      aspect-ratio: 16\/9;\n      object-fit: cover;\n      width: 100%;\n      margin-bottom: 12px;\n    }\n    section {\n      padding: 30px 0 18px;\n    }\n    .section-head h3 {\n      font-size: clamp(24px, 3vw, 34px);\n      color: var(--ink);\n      position: relative;\n      padding-bottom: 10px;\n    }\n    .section-head h3::after {\n      content: \"\";\n      position: absolute;\n      left: 0;\n      bottom: 0;\n      width: 84px;\n      height: 3px;\n      background: linear-gradient(90deg, var(--accent), rgba(242,201,76,0.3));\n      border-radius: 999px;\n    }\n    .cards {\n      display: grid;\n      gap: 18px;\n    }\n    .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }\n    .grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }\n    .grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }\n    .card {\n      background: var(--glass);\n      border: 1px solid rgba(212,175,55,0.22);\n      border-radius: var(--radius);\n      padding: 22px;\n      backdrop-filter: blur(16px);\n      transition: all 0.25s;\n      box-shadow: 0 12px 26px rgba(0,0,0,0.06);\n    }\n    .card:hover { transform: translateY(-4px); background: rgba(255, 250, 236, 0.92);}\n    .timeline-item {\n      display: grid;\n      grid-template-columns: 92px 1fr;\n      gap: 16px;\n      background: rgba(255,255,255,0.82);\n      border-radius: 20px;\n      padding: 18px 20px;\n      backdrop-filter: blur(12px);\n      border: 1px solid rgba(212,175,55,0.2);\n      margin-bottom: 14px;\n    }\n    .timeline-date {\n      font-weight: 800;\n      color: var(--primary-dark);\n    }\n    .join-box {\n      background: linear-gradient(135deg, #0f0f0f, var(--primary-dark));\n      border-radius: 32px;\n      padding: 30px;\n      color: #fff;\n      box-shadow: 0 24px 40px rgba(0,0,0,0.3);\n    }\n    .join-box h3 {\n      color: #fff9ef;\n      font-size: clamp(26px, 3.4vw, 40px);\n      font-weight: 800;\n      text-shadow: 0 4px 12px rgba(0, 0, 0, 0.5), 0 0 8px rgba(212, 175, 55, 0.3);\n      margin-top: 0;\n      margin-bottom: 16px;\n    }\n    .join-box p {\n      color: rgba(255, 250, 225, 0.95);\n      line-height: 1.7;\n      font-weight: 500;\n    }\n    .join-actions {\n      display: flex;\n      gap: 20px;\n      flex-wrap: wrap;\n      justify-content: flex-end;\n    }\n    .btn-light {\n      background: rgba(255,245,214,0.96);\n      color: var(--primary-dark);\n      border: none;\n      box-shadow: 0 6px 14px rgba(0,0,0,0.2);\n    }\n    .btn-outline-light {\n      border: 1.5px solid rgba(255,255,245,0.7);\n      color: #fff;\n      background: rgba(255,255,255,0.12);\n      backdrop-filter: blur(8px);\n    }\n    .join-grid {\n      display: grid;\n      grid-template-columns: 1.2fr 0.8fr;\n      gap: 28px;\n      align-items: center;\n    }\n    footer {\n      border-top: 1px solid rgba(212,175,55,0.2);\n      background: rgba(255,249,236,0.94);\n      margin-top: 30px;\n    }\n    .footer-grid {\n      display: grid;\n      grid-template-columns: 1.2fr 0.8fr 0.8fr;\n      gap: 18px;\n      padding: 28px 0;\n    }\n    @media (max-width: 980px) {\n      .hero-grid, .join-grid, .footer-grid, .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }\n      .breakout-img { width: 75%; transform: translateY(-8px); }\n      .breakout-wrapper { margin: -10px 0 -20px 0; }\n      .join-actions { justify-content: flex-start; gap: 16px; }\n    }\n    @media (max-width: 640px) {\n      .floating-stats { grid-template-columns: 1fr; }\n      .hero h2 { font-size: 32px; }\n      .timeline-item { grid-template-columns: 1fr; }\n      .join-actions { gap: 14px; flex-direction: column; width: 100%; }\n      .btn-light, .btn-outline-light { width: 100%; justify-content: center; }\n    }\n    .hot-tag {\n      display: inline-block;\n      background: rgba(212,175,55,0.25);\n      backdrop-filter: blur(4px);\n      padding: 4px 10px;\n      border-radius: 40px;\n      font-size: 12px;\n      font-weight: bold;\n      margin-left: 8px;\n      animation: softPulse 1.5s infinite;\n    }\n\n    \/* \u52d5\u614b\u73bb\u7483\u6d41\u5149 *\/\n    .hero-visual, .feature-slider-card, .card.media-card {\n      position: relative;\n      overflow: hidden;\n    }\n    .hero-visual::after, .feature-slider-card::after, .card.media-card::after {\n      content: \"\";\n      position: absolute;\n      top: 0;\n      left: -100%;\n      width: 80%;\n      height: 100%;\n      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), rgba(255, 240, 190, 0.5), rgba(255, 255, 255, 0.35), transparent);\n      transform: skewX(-15deg);\n      pointer-events: none;\n      z-index: 3;\n      animation: glassFlow 5.5s ease-in-out infinite;\n      mix-blend-mode: overlay;\n    }\n    @keyframes glassFlow {\n      0% { left: -120%; opacity: 0; }\n      15% { opacity: 1; }\n      45% { left: 120%; opacity: 1; }\n      60% { opacity: 0; }\n      100% { left: 120%; opacity: 0; }\n    }\n  <\/style>\n\n\n\n<main>\n  <section class=\"hero\">\n    <div class=\"container hero-grid\">\n      <div class=\"fade-up\">\n        <div class=\"eyebrow\">\u50b3\u627f\u4e94\u8853\u667a\u6167\u30fb\u5efa\u7acb\u6b63\u78ba\u89c0\u5ff5\u30fb\u4fc3\u9032\u4ea4\u6d41\u5b78\u7fd2<\/div>\n        <h2>\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703<br><span>\u5b98\u65b9\u7db2\u7ad9<\/span><\/h2>\n        <p>\u672c\u6703\u70ba\u5167\u653f\u90e8\u6838\u51c6\u7acb\u6848\u4e4b\u793e\u6703\u5718\u9ad4\uff0c\u7acb\u6848\u8b49\u66f8\u5b57\u865f\uff1a1060088053\u3002\u4ee5\u4e94\u8853\u6587\u5316\u4ea4\u6d41\u3001\u547d\u7406\u6559\u80b2\u3001\u98a8\u6c34\u5be6\u52d9\u3001\u64c7\u65e5\u61c9\u7528\u3001\u59d3\u540d\u5b78\u7814\u7a76\u8207\u5c08\u696d\u8b1b\u5ea7\u70ba\u6838\u5fc3\uff0c\u7d50\u5408\u5b78\u8853\u3001\u5be6\u52d9\u8207\u516c\u76ca\uff0c\u6253\u9020\u503c\u5f97\u4fe1\u8cf4\u7684\u4ea4\u6d41\u5e73\u53f0\u3002<\/p>\n        <div class=\"typewriter\" id=\"typewriterEffect\"><\/div>\n        <div class=\"hero-actions\">\n          <a class=\"btn btn-primary\" href=\"#contact\">\u7acb\u5373\u806f\u7d61\u5354\u6703<\/a>\n          <a class=\"btn btn-secondary\" href=\"#news\">\u67e5\u770b\u6700\u65b0\u6d3b\u52d5<\/a>\n        <\/div>\n        <div class=\"dynamic-news\">\n          <span class=\"news-icon\">\ud83d\udd25 \u52d5\u614b\u5feb\u5831<\/span>\n          <span id=\"rollingMsg\" class=\"rolling-text\">\u4e94\u8853\u9032\u968e\u5de5\u4f5c\u574a\u958b\u653e\u5831\u540d\u4e2d\uff0c\u540d\u984d\u6709\u9650\uff01<\/span>\n        <\/div>\n        <!-- \u7a7a\u767d\u7684 tagline \u5340\u584a\u5df2\u522a\u9664 -->\n      <\/div>\n      <div class=\"hero-card fade-up\">\n        <div class=\"hero-visual\">\n          <img decoding=\"async\" class=\"hero-photo\" src=\"https:\/\/picsum.photos\/id\/104\/800\/600\" alt=\"\u4e94\u8853\u610f\u8c61\">\n          <div class=\"hero-visual-content\" style=\"position:relative; z-index:2;\">\n            <div class=\"hero-visual-title\">\u9670\u967d\u4e94\u884c\u30fb\u667a\u6167\u50b3\u627f<\/div>\n            <div class=\"hero-visual-sub\">\u5c08\u696d\u7cfb\u7d71\u5316\u5b78\u7fd2\uff0c\u958b\u555f\u4e94\u8853\u65b0\u8996\u91ce\u3002<\/div>\n            <div class=\"dynamic-slogan\"><span>\u2728 \u7cbe\u9078\u52d5\u614b<\/span><span id=\"liveSlogan\" class=\"slogan-text\">\u5947\u9580\u9041\u7532\u5be6\u6230\u73ed\u597d\u8a55\u518d\u52a0\u958b<\/span><\/div>\n            <div class=\"floating-stats\">\n              <div class=\"stat\" data-target=\"28\"><strong>0<\/strong><span>\u5c08\u696d\u8ab2\u7a0b\u6a21\u7d44<\/span><\/div>\n              <div class=\"stat\" data-target=\"15\"><strong>0<\/strong><span>\u8cc7\u6df1\u8b1b\u5e2b\u9867\u554f<\/span><\/div>\n              <div class=\"stat\" data-target=\"1260\"><strong>0<\/strong><span>\u5b78\u54e1\u4ea4\u6d41\u4eba\u6b21<\/span><\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"sliderSpotlight\">\n    <div class=\"container\">\n      <div class=\"section-head\"><div><h3>\ud83c\udf1f \u7cbe\u9078\u7126\u9ede\u30fb\u6d3b\u52d5\u6ed1\u584a <span class=\"hot-tag\">\u71b1\u9580\u63a8\u85a6<\/span><\/h3><p>\u6ed1\u52d5\u700f\u89bd\u5354\u6703\u71b1\u9580\u8b1b\u5ea7\u8207\u7279\u8272\u8ab2\u7a0b<\/p><\/div><\/div>\n      <div class=\"swiper mySwiper\">\n        <div class=\"swiper-wrapper\">\n          <div class=\"swiper-slide\"><div class=\"feature-slider-card\"><img decoding=\"async\" src=\"https:\/\/picsum.photos\/id\/133\/600\/400\" alt=\"\u5947\u9580\u8b1b\u5ea7\"><h4>\u5947\u9580\u9041\u7532\u9ad8\u968e\u61c9\u7528\u73ed<\/h4><p>\u540d\u5e2b\u89aa\u6388\uff0c\u5f9e\u57fa\u790e\u5230\u5be6\u6230\uff0c\u5feb\u901f\u638c\u63e1\u5947\u9580\u79d8\u6cd5\u3002<\/p><\/div><\/div>\n          <div class=\"swiper-slide\"><div class=\"feature-slider-card\"><img decoding=\"async\" src=\"https:\/\/picsum.photos\/id\/162\/600\/400\" alt=\"\u98a8\u6c34\u5be6\u52d9\"><h4>\u967d\u5b85\u98a8\u6c34\u8a3a\u65b7\u5be6\u6230\u71df<\/h4><p>\u5be6\u5730\u582a\u8f3f\uff0c\u89e3\u6790\u6d41\u5e74\u8ca1\u4f4d\u8207\u683c\u5c40\u898f\u5283\u3002<\/p><\/div><\/div>\n          <div class=\"swiper-slide\"><div class=\"feature-slider-card\"><img decoding=\"async\" src=\"https:\/\/picsum.photos\/id\/260\/600\/400\" alt=\"\u59d3\u540d\u5b78\"><h4>\u59d3\u540d\u5b78\u958b\u904b\u8b1b\u5ea7<\/h4><p>\u540d\u5b57\u5f71\u97ff\u4e00\u751f\uff0c\u63ed\u958b\u59d3\u540d\u5bc6\u78bc\u8207\u8077\u5834\u8cb4\u4eba\u904b\u3002<\/p><\/div><\/div>\n          <div class=\"swiper-slide\"><div class=\"feature-slider-card\"><img decoding=\"async\" src=\"https:\/\/picsum.photos\/id\/29\/600\/400\" alt=\"\u64c7\u65e5\u8ab2\u7a0b\"><h4>\u64c7\u65e5\u5b78\u7cbe\u4fee\u73ed<\/h4><p>\u5ac1\u5a36\u3001\u958b\u5e02\u3001\u5165\u5b85\u64c7\u65e5\u5fc3\u6cd5\uff0c\u53e4\u6cd5\u65b0\u7528\u3002<\/p><\/div><\/div>\n          <div class=\"swiper-slide\"><div class=\"feature-slider-card\"><img decoding=\"async\" src=\"https:\/\/picsum.photos\/id\/186\/600\/400\" alt=\"\u547d\u7406\u5ea7\u8ac7\"><h4>\u516b\u5b57\u547d\u7406\u6df1\u5ea6\u5c0d\u8ac7<\/h4><p>\u7d50\u5408\u73fe\u4ee3\u5fc3\u7406\u5b78\uff0c\u5256\u6790\u4eba\u751f\u904b\u52e2\u8f49\u6298\u3002<\/p><\/div><\/div>\n        <\/div>\n        <div class=\"swiper-pagination\"><\/div>\n        <div class=\"swiper-button-next\"><\/div>\n        <div class=\"swiper-button-prev\"><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"about\"><div class=\"container\"><div class=\"section-head\"><div><h3>\u95dc\u65bc\u5354\u6703<\/h3><p>\u4ee5\u6587\u5316\u50b3\u627f\u3001\u77e5\u8b58\u4ea4\u6d41\u8207\u793e\u6703\u6559\u80b2\u70ba\u51fa\u767c\u9ede\u3002<\/p><\/div><\/div><div class=\"cards grid-3\">\n    <article class=\"card fade-up\"><div class=\"icon\" style=\"font-size:32px;\">\ud83c\udfdb\ufe0f<\/div><h4>\u6b63\u5f0f\u7acb\u6848<\/h4><p>\u5167\u653f\u90e8\u6838\u51c6\u7acb\u6848\u4e4b\u793e\u6703\u5718\u9ad4\uff0c\u63d0\u4f9b\u53ef\u9760\u5c0d\u5916\u7a97\u53e3\u3002<\/p><\/article>\n    <article class=\"card fade-up\"><div class=\"icon\" style=\"font-size:32px;\">\ud83d\udcda<\/div><h4>\u77e5\u8b58\u6559\u80b2<\/h4><p>\u7cfb\u7d71\u5316\u547d\u7406\u3001\u98a8\u6c34\u3001\u64c7\u65e5\u7b49\u5167\u5bb9\uff0c\u5b78\u61c2\u5b78\u4ee5\u81f4\u7528\u3002<\/p><\/article>\n    <article class=\"card fade-up\"><div class=\"icon\" style=\"font-size:32px;\">\ud83e\udd1d<\/div><h4>\u4ea4\u6d41\u5408\u4f5c<\/h4><p>\u63a8\u52d5\u8b1b\u5ea7\u3001\u7814\u7fd2\u8207\u8de8\u9818\u57df\u5408\u4f5c\uff0c\u5ee3\u7d50\u5584\u7de3\u3002<\/p><\/article>\n  <\/div><\/div><\/section>\n\n  <!-- \u7406\u4e8b\u9577\u5340\u584a\uff1a\u53bb\u80cc\u5716\u7121\u5916\u6846\u7834\u683c -->\n  <section id=\"founder\">\n    <div class=\"container\">\n      <div class=\"section-head\"><div><h3>\u7406\u4e8b\u9577\u4ecb\u7d39 <\/h3><\/div><\/div>\n      <div class=\"cards grid-2\">\n        <article class=\"card founder-breakout fade-up\">\n          <div class=\"breakout-wrapper\">\n            <img decoding=\"async\" class=\"breakout-img\" src=\"https:\/\/fiveartsassociation.org\/wp-content\/uploads\/2026\/05\/\u738b\u5747\u666f\u7406\u4e8b\u9577\u53bb\u80cc.jpg\" alt=\"\u7406\u4e8b\u9577\u738b\u5747\u666f \u53bb\u80cc\u5f62\u8c61\u7167 \u7834\u683c\u7121\u5916\u6846\">\n          <\/div>\n        <\/article>\n        <article class=\"card founder-text-card fade-up\">\n          <div class=\"meta\" style=\"display:flex; align-items:center; gap:6px;\">\ud83c\udfc5 \u5354\u6703\u6838\u5fc3\u4ee3\u8868<\/div>\n          <h4>\u7406\u4e8b\u9577 \u738b\u5747\u666f <span style=\"font-size:14px; background:#d4af3722; padding:2px 8px; border-radius:40px;\">\u4e94\u8853\u9818\u822a\u8005<\/span><\/h4>\n          <p>\u4e94\u8853\u6559\u80b2\u6df1\u8015\u8005\uff0c\u81f4\u529b\u5c07\u50b3\u7d71\u667a\u6167\u8207\u73fe\u4ee3\u751f\u6d3b\u7d50\u5408\uff0c\u958b\u8fa6\u591a\u5143\u8ab2\u7a0b\u8207\u516c\u76ca\u8b1b\u5ea7\uff0c\u5e36\u52d5\u6b63\u5411\u4ea4\u6d41\u3002\u7406\u4e8b\u9577\u5be6\u6230\u7d93\u9a57\u8c50\u5bcc\uff0c\u5e36\u9818\u5354\u6703\u8d70\u5411\u5c08\u696d\u5316\u3001\u570b\u969b\u5316\u3002<\/p>\n          <div class=\"pill-list\"><span class=\"pill\">\u4e94\u8853\u6559\u80b2<\/span><span class=\"pill\">\u6587\u5316\u4ea4\u6d41<\/span><span class=\"pill\">\u8ab2\u7a0b\u8b1b\u5ea7<\/span><span class=\"pill\">\u516c\u76ca\u63a8\u5ee3<\/span><\/div>\n        <\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section id=\"services\"><div class=\"container\"><div class=\"section-head\"><div><h3>\u4e94\u8853\u9818\u57df<\/h3><p>\u5354\u6703\u5c08\u9577\u5206\u985e\uff0c\u5be6\u7528\u5167\u5bb9\u5c0e\u5411<\/p><\/div><\/div><div class=\"cards grid-4\">\n    <article class=\"card media-card fade-up\"><img decoding=\"async\" class=\"card-photo\" src=\"https:\/\/picsum.photos\/id\/168\/400\/300\" alt=\"\u547d\u7406\" style=\"border-radius: 18px; margin-bottom: 12px;\"><div class=\"meta\">01\uff5c\u547d\u7406<\/div><h4>\u547d\u7406\u89e3\u6790<\/h4><p>\u516b\u5b57\u3001\u7d2b\u5fae\u3001\u6d41\u5e74\u904b\u52e2\uff0c\u4eba\u751f\u898f\u5283\u5f15\u5c0e\u3002<\/p><\/article>\n    <article class=\"card media-card fade-up\"><img decoding=\"async\" class=\"card-photo\" src=\"https:\/\/picsum.photos\/id\/158\/400\/300\" alt=\"\u98a8\u6c34\" style=\"border-radius: 18px; margin-bottom: 12px;\"><div class=\"meta\">02\uff5c\u98a8\u6c34<\/div><h4>\u98a8\u6c34\u5be6\u52d9<\/h4><p>\u4f4f\u5b85\u3001\u5e97\u9762\u683c\u5c40\uff0c\u8ca1\u4f4d\u8207\u5316\u89e3\u6280\u5de7\u3002<\/p><\/article>\n    <article class=\"card media-card fade-up\"><img decoding=\"async\" class=\"card-photo\" src=\"https:\/\/picsum.photos\/id\/127\/400\/300\" alt=\"\u64c7\u65e5\" style=\"border-radius: 18px; margin-bottom: 12px;\"><div class=\"meta\">03\uff5c\u64c7\u65e5<\/div><h4>\u64c7\u65e5\u61c9\u7528<\/h4><p>\u5a5a\u5ac1\u3001\u958b\u5de5\u3001\u958b\u5e02\uff0c\u5409\u65e5\u9078\u64c7\u7cbe\u89e3\u3002<\/p><\/article>\n    <article class=\"card media-card fade-up\"><img decoding=\"async\" class=\"card-photo\" src=\"https:\/\/picsum.photos\/id\/26\/400\/300\" alt=\"\u59d3\u540d\u5b78\" style=\"border-radius: 18px; margin-bottom: 12px;\"><div class=\"meta\">04\uff5c\u59d3\u540d\u5b78<\/div><h4>\u59d3\u540d\u7814\u7a76<\/h4><p>\u7d50\u69cb\u3001\u7b46\u756b\u5bd3\u610f\uff0c\u6539\u540d\u53d6\u540d\u5de7\u601d\u3002<\/p><\/article>\n  <\/div><\/div><\/section>\n\n  <section id=\"news\"><div class=\"container\"><div class=\"section-head\"><div><h3>\u6700\u65b0\u6d88\u606f\u8207\u6d3b\u52d5 <span class=\"hot-tag\">\u52d5\u614b\u8f2a\u64ad<\/span><\/h3><p>\u8ab2\u7a0b\u62db\u751f\u3001\u8b1b\u5ea7\u8cc7\u8a0a\u3001\u91cd\u8981\u516c\u544a<\/p><\/div><\/div><div class=\"timeline\">\n    <div class=\"timeline-item fade-up\"><div class=\"timeline-date\">2026<br>\u6700\u65b0<\/div><div><h4>\u79cb\u5b63\u547d\u7406\u6587\u5316\u796d<\/h4><p>10\u6708\u5927\u578b\u8b1b\u5ea7 x \u516b\u5b57\u64c2\u53f0\u8cfd\uff0c\u5831\u540d\u958b\u8dd1\u3002<\/p><\/div><\/div>\n    <div class=\"timeline-item fade-up\"><div class=\"timeline-date\">\u8ab2\u7a0b<br>\u62db\u751f<\/div><div><h4>\u4e94\u8853\u5e2b\u8cc7\u57f9\u8a13\u73ed<\/h4><p>\u7d50\u5408\u7406\u8ad6\u8207\u5be6\u52d9\uff0c\u57f9\u80b2\u65b0\u4e00\u4ee3\u5c08\u696d\u8b1b\u5e2b\u3002<\/p><\/div><\/div>\n    <div class=\"timeline-item fade-up\"><div class=\"timeline-date\">\u516c\u544a<br>\u66f4\u65b0<\/div><div><h4>\u6703\u54e1\u7368\u4eab\u7dda\u4e0a\u5b78\u7fd2\u5e73\u53f0\u555f\u52d5<\/h4><p>\u52a0\u5165\u6703\u54e1\u5373\u4eab\u8c50\u5bcc\u5f71\u97f3\u8ab2\u7a0b\u8207\u6559\u6750\u3002<\/p><\/div><\/div>\n  <\/div><\/div><\/section>\n\n  <section class=\"join\" id=\"contact\">\n    <div class=\"container\">\n      <div class=\"join-box fade-up\">\n        <div class=\"join-grid\">\n          <div>\n            <h3>\u52a0\u5165\u5354\u6703\uff0c\u638c\u63e1\u6700\u65b0\u8ab2\u7a0b\u8207\u6d3b\u52d5\u8cc7\u8a0a<\/h3>\n            <p>\u6b61\u8fce\u900f\u904e\u7db2\u7ad9\u3001Facebook\u3001YouTube \u8207 LINE \u5b98\u65b9\u5e33\u865f\u8207\u6211\u5011\u806f\u7e6b\u3002\u6301\u7e8c\u63a8\u52d5\u4e94\u8853\u6587\u5316\u4ea4\u6d41\u3001\u6559\u80b2\u5206\u4eab\u8207\u6703\u54e1\u670d\u52d9\u3002<\/p>\n          <\/div>\n          <div class=\"join-actions\">\n            <a class=\"btn btn-light\" href=\"#\">\u52a0\u5165 LINE \u5b98\u65b9\u5e33\u865f<\/a>\n            <a class=\"btn btn-outline-light\" href=\"#\">\u8ffd\u8e64 Facebook \u7c89\u5c08<\/a>\n            <a class=\"btn btn-outline-light\" href=\"#\">\u8a02\u95b1 YouTube \u983b\u9053<\/a>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n<\/main>\n\n<footer><div class=\"container footer-grid\"><div><h5>\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703<\/h5><p>\u5167\u653f\u90e8\u6838\u51c6\u7acb\u6848\u793e\u6703\u5718\u9ad4\uff0c\u7acb\u6848\u8b49\u66f8\u5b57\u865f\uff1a1060088053\u3002<\/p><p>\u63a8\u5ee3\u4e94\u8853\u6587\u5316\u4ea4\u6d41\u3001\u547d\u7406\u77e5\u8b58\u6559\u80b2\u3001\u98a8\u6c34\u5be6\u52d9\u5206\u4eab\u7b49\u3002<\/p><\/div><div><h5>\u7db2\u7ad9\u5c0e\u89bd<\/h5><ul><li><a href=\"#about\">\u95dc\u65bc\u5354\u6703<\/a><\/li><li><a href=\"#services\">\u4e94\u8853\u9818\u57df<\/a><\/li><li><a href=\"#news\">\u6700\u65b0\u6d88\u606f<\/a><\/li><\/ul><\/div><div><h5>\u806f\u7d61\u65b9\u5f0f<\/h5><ul><li>Email\uff1achimen411@gmail.com<\/li><li>\u5b98\u65b9 LINE\uff1a\u52a0\u5165\u597d\u53cb\u7372\u53d6\u8cc7\u8a0a<\/li><li>YouTube\uff1a\u4e94\u8853\u4ea4\u6d41\u983b\u9053<\/li><\/ul><\/div><\/div><div class=\"container copyright\">\u00a9 2026 \u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703. All Rights Reserved.<\/div><\/footer>\n\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.js\"><\/script>\n<script>\n  (function(){\n    new Swiper('.mySwiper', {\n      slidesPerView: 1, spaceBetween: 20, loop: true, autoplay: { delay: 4200, disableOnInteraction: false },\n      pagination: { el: '.swiper-pagination', clickable: true },\n      navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' },\n      breakpoints: { 640: { slidesPerView: 2 }, 1024: { slidesPerView: 3 } }\n    });\n    const newsMessages = [\"\u2728 2026 \u4e94\u8853\u5e74\u6703\u9810\u5b9a11\u6708\u767b\u5834\uff0c\u656c\u8acb\u671f\u5f85\uff01\", \"\ud83d\udcd6 \u65b0\u63a8\u51fa\u300c\u967d\u5b85\u98a8\u6c34\u7dda\u4e0a\u8ab2\u7a0b\u300d\u65e9\u9ce5\u512a\u60e0\u4e2d\", \"\ud83c\udfa4 \u7406\u4e8b\u9577\u516c\u76ca\u8b1b\u5ea7 9\/18 \u514d\u8cbb\u5165\u5834\uff0c\u7acb\u5373\u5361\u4f4d\", \"\ud83c\udfc6 \u5354\u6703\u5b98\u65b9LINE\u65b0\u597d\u53cb\u8d08\u9001\u57fa\u790e\u547d\u7406\u8b1b\u7fa9\"];\n    const sloganList = [\"\u5947\u9580\u9041\u7532\u5be6\u6230\u73ed\u597d\u8a55\u518d\u52a0\u958b\", \"\u98a8\u6c34\u5be6\u52d9\u8ab2\u7a0b\u5be6\u5730\u8003\u5bdf\u62db\u751f\u4e2d\", \"\u59d3\u540d\u5b78\u7814\u7a76\uff5c\u89e3\u9396\u6539\u540d\u5967\u79d8\", \"\u64c7\u65e5\u5b78\uff1a\u64c7\u5409\u8da8\u907f\uff0c\u597d\u904b\u81ea\u4f86\"];\n    let msgIdx = 0, sloganIdx = 0;\n    const rollingSpan = document.getElementById('rollingMsg');\n    const sloganSpan = document.getElementById('liveSlogan');\n    if(rollingSpan) setInterval(() => { msgIdx = (msgIdx+1)%newsMessages.length; rollingSpan.style.opacity='0'; setTimeout(()=>{ rollingSpan.innerText = newsMessages[msgIdx]; rollingSpan.style.opacity='1'; },200); }, 4400);\n    if(sloganSpan) setInterval(() => { sloganIdx = (sloganIdx+1)%sloganList.length; sloganSpan.style.opacity='0'; setTimeout(()=>{ sloganSpan.innerText = sloganList[sloganIdx]; sloganSpan.style.opacity='1'; },180); }, 3800);\n    const statNumbers = document.querySelectorAll('.stat');\n    const targetVals = [];\n    statNumbers.forEach((stat,idx) => { targetVals.push(parseInt(stat.getAttribute('data-target'),10)); const strong=stat.querySelector('strong'); if(strong) strong.innerText='0'; });\n    let animated=false;\n    function animateNumbers(){\n      if(animated) return; animated=true;\n      statNumbers.forEach((stat,idx)=>{\n        const target = targetVals[idx], strong=stat.querySelector('strong'); if(!strong) return;\n        let cur=0, step=Math.ceil(target\/45);\n        const timer=setInterval(()=>{ cur+=step; if(cur>=target){ strong.innerText=target; clearInterval(timer); } else strong.innerText=cur; }, 22);\n      });\n    }\n    const statsObs = new IntersectionObserver((entries)=>{ entries.forEach(e=>{ if(e.isIntersecting){ animateNumbers(); statsObs.unobserve(e.target); } }); },{threshold:0.3});\n    const statsBlock = document.querySelector('.floating-stats'); if(statsBlock) statsObs.observe(statsBlock); else animateNumbers();\n    const typeElement = document.getElementById('typewriterEffect');\n    if(typeElement){\n      const phrases = [\"\u5f18\u63da\u4e94\u8853\u6b63\u5ff5 \u00b7 \u4ea4\u6d41\u5be6\u8b49\u667a\u6167\", \"\u5167\u653f\u90e8\u7acb\u6848\u5c08\u696d\u5354\u6703\", \"\u547d\u7406\u30fb\u98a8\u6c34\u30fb\u64c7\u65e5\u30fb\u59d3\u540d\u5b78\"];\n      let idx=0, charIdx=0, isDeleting=false;\n      function typeEffect(){\n        let current = phrases[idx];\n        if(isDeleting) typeElement.innerHTML = current.substring(0, charIdx--) + '<span class=\"typed-cursor\">|<\/span>';\n        else typeElement.innerHTML = current.substring(0, charIdx++) + '<span class=\"typed-cursor\">|<\/span>';\n        if(!isDeleting && charIdx === current.length+1){ isDeleting=true; setTimeout(typeEffect, 1800); return; }\n        if(isDeleting && charIdx === 0){ isDeleting=false; idx=(idx+1)%phrases.length; setTimeout(typeEffect, 400); return; }\n        setTimeout(typeEffect, isDeleting? 65 : 95);\n      }\n      typeEffect();\n    }\n    const fadeElements = document.querySelectorAll('.fade-up');\n    const appearObserver = new IntersectionObserver((entries)=>{ entries.forEach(e=>{ if(e.isIntersecting){ e.target.classList.add('visible'); appearObserver.unobserve(e.target); } }); },{threshold:0.12});\n    fadeElements.forEach(el=>appearObserver.observe(el));\n    document.querySelectorAll('.card, .timeline-item, .join-box').forEach(el=>{ if(!el.classList.contains('fade-up')){ el.classList.add('fade-up'); appearObserver.observe(el); } });\n    setTimeout(()=>{ fadeElements.forEach(el=>{ if(el.getBoundingClientRect().top<window.innerHeight) el.classList.add('visible'); }); },150);\n  })();\n<\/script>\n\n\n```\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703\uff5c\u5b98\u65b9\u7db2\u7ad9 \u50b3\u627f\u4e94\u8853\u667a\u6167\u30fb\u5efa\u7acb\u6b63\u78ba\u89c0\u5ff5\u30fb\u4fc3\u9032\u4ea4\u6d41\u5b78\u7fd2 \u4e2d\u83ef\u4e94\u65b9\u4e94\u8853\u4ea4\u6d41\u5354\u6703\u5b98\u65b9\u7db2\u7ad9 \u672c\u6703\u70ba [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-20","page","type-page","status-publish","hentry"],"blocksy_meta":{"has_hero_section":"disabled","styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":6},"hero_margin":"0px"},"_links":{"self":[{"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=\/wp\/v2\/pages\/20","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=20"}],"version-history":[{"count":5,"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=\/wp\/v2\/pages\/20\/revisions"}],"predecessor-version":[{"id":118,"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=\/wp\/v2\/pages\/20\/revisions\/118"}],"wp:attachment":[{"href":"https:\/\/fiveartsassociation.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=20"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}