.elementor-2250 .elementor-element.elementor-element-d373925{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-91da907{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-91da907:not(.elementor-motion-effects-element-type-background), .elementor-2250 .elementor-element.elementor-element-91da907 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-astglobalcolor5 );}.elementor-2250 .elementor-element.elementor-element-5a48d6a{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-caf7667{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-f0e442d .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-2250 .elementor-element.elementor-element-995d17b{--divider-border-style:solid;--divider-color:#000;--divider-border-width:1px;}.elementor-2250 .elementor-element.elementor-element-995d17b .elementor-divider-separator{width:100%;}.elementor-2250 .elementor-element.elementor-element-995d17b .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-2250 .elementor-element.elementor-element-bc45866{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-8752dc7{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-47b11a4{--divider-border-style:solid;--divider-color:#000;--divider-border-width:1px;}.elementor-2250 .elementor-element.elementor-element-47b11a4 .elementor-divider-separator{width:100%;}.elementor-2250 .elementor-element.elementor-element-47b11a4 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-2250 .elementor-element.elementor-element-8ba00b0 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-2250 .elementor-element.elementor-element-a6a1b32{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-4efc660{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-78d2788{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2250 .elementor-element.elementor-element-0530027{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for container, class: .elementor-element-caf7667 */.rotary-page .section-heading-group {
  width: fit-content;
  max-width: 100%;
  flex: 0 0 auto;
  align-self: flex-start;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-42d5d14 */<style>
/* =========================
   RI 區塊樣式修正版
========================= */
.ri-hero-section,
.ri-hero-section * {
  box-sizing: border-box;
}

.ri-hero-section {
  width: 100%;
  position: relative;
  /* 加上深藍色底色 #1A458B 作為備用，就算圖片路徑不對也不會變白底白字 */
  background: #1A458B url('https://twrotary461.shop.metabiz.tw/storage/twrotary461/2026/08/ChatGPT-Image-2026年7月1日-下午04_18_31.png') center/cover no-repeat;
  padding: 58px 20px 48px;
  font-family: 'Noto Sans TC', 'Roboto', sans-serif;
}

.ri-hero-container {
  max-width: 1294px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 58px;
}

/* 上方文字區域 */
.ri-hero-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.ri-badge {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 8px 15px;
  gap: 11px;
  border: 1px solid #F5A800;
  border-radius: 999px;
}

.ri-badge-icon, .ri-stats-header-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ri-badge-text {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.11em;
  color: #F5A800;
  margin: 0;
}

.ri-heading-group {
  display: flex;
  flex-direction: column;
}

.ri-title-main {
  font-weight: 700;
  font-size: 48px;
  line-height: 1.6;
  letter-spacing: 0.16em;
  color: #FFFFFF;
  margin: 0;
}

.ri-title-sub {
  font-weight: 700;
  font-size: 48px;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #F5A800;
  margin: 0;
}

.ri-description {
  font-family: 'Roboto', 'Noto Sans TC', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0.11em;
  color: #FFFFFF;
  margin: 0;
}

/* 下方數據面板 */
.ri-stats-panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 30px 37px;
  gap: 20px;
  background: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.05);
}

.ri-stats-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  gap: 11px;
}

.ri-stats-header-title {
  font-weight: 700;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: 0.12em;
  color: #1A458B;
  margin: 0;
}

.ri-stats-grid {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 20px;
}

.ri-stat-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 22px;
}

/* 數據圖示圓圈 */
.ri-stat-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 96px;
  height: 96px;
  border-radius: 62px;
  flex-shrink: 0;
}

.ri-bg-blue-light { background: #EAF1FF; }
.ri-bg-orange-light { background: #FFF4DD; }
.ri-bg-cyan-light { background: #E8F6FF; }
.ri-bg-teal-light { background: #E9F9FC; }

/* 數據文字 */
.ri-stat-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ri-stat-number {
  font-weight: 700;
  font-size: 28px;
  line-height: 1.2;
  letter-spacing: 0.13em;
  white-space: nowrap; /* 強制數字與加號不換行 */
}

.ri-stat-label {
  font-family: 'Roboto', 'Noto Sans TC', sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0.11em;
  color: #000000;
  white-space: nowrap;
}

/* 各別數字顏色 */
.ri-text-blue-dark { color: #1A458B; }
.ri-text-orange { color: #F5A800; }
.ri-text-cyan { color: #1DA1F2; }
.ri-text-teal { color: #2CA6C4; }

/* 垂直分隔線 */
.ri-stat-divider {
  width: 1px;
  height: 100px;
  background: #F2F2F2;
}

/* 響應式調整 */
@media (max-width: 1200px) {
  .ri-stats-grid {
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
  }
  .ri-stat-divider {
    display: none;
  }
}
</style>

<section class="ri-hero-section">
  <div class="ri-hero-container">
    
    <!-- 上方：主視覺文字區 -->
    <div class="ri-hero-content">
      <div class="ri-badge">
        <span class="ri-badge-icon">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" stroke="#F5A800" stroke-width="2"/><path d="M2 12H22M12 2C14.5 2 17 6.5 17 12C17 17.5 14.5 22 12 22C9.5 22 7 17.5 7 12C7 6.5 9.5 2 12 2Z" stroke="#F5A800" stroke-width="2"/></svg>
        </span>
        <span class="ri-badge-text">ROTARY INTERNATIONAL</span>
      </div>

      <div class="ri-heading-group">
        <h1 class="ri-title-main">國際扶輪</h1>
        <h2 class="ri-title-sub">ＲＩ現況</h2>
      </div>

      <p class="ri-description">
        扶輪的組織分成扶輪社、地區與國際三種階層，<br>
        透過全球超過 35,000 個扶輪社，<br>
        協助實現超越個人的服務計畫。
      </p>
    </div>

    <!-- 下方：全球影響力數據面板 -->
    <div class="ri-stats-panel">
      <div class="ri-stats-header">
        <span class="ri-stats-header-icon">
          <svg width="25" height="25" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" stroke="#1A458B" stroke-width="2"/><path d="M2 12H22M12 2C14.5 2 17 6.5 17 12C17 17.5 14.5 22 12 22C9.5 22 7 17.5 7 12C7 6.5 9.5 2 12 2Z" stroke="#1A458B" stroke-width="2"/></svg>
        </span>
        <h3 class="ri-stats-header-title">全球影響力</h3>
      </div>

      <div class="ri-stats-grid">
        
        <!-- 數據 1: 社員 -->
        <div class="ri-stat-item">
          <div class="ri-stat-icon ri-bg-blue-light">
            <svg width="45" height="40" viewBox="0 0 24 24" fill="#1A458B"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>
          </div>
          <div class="ri-stat-text">
            <div class="ri-stat-number ri-text-blue-dark">120萬＋</div>
            <div class="ri-stat-label">社員</div>
          </div>
        </div>

        <div class="ri-stat-divider"></div>

        <!-- 數據 2: 全球扶輪社 -->
        <div class="ri-stat-item">
          <div class="ri-stat-icon ri-bg-orange-light">
            <svg width="45" height="40" viewBox="0 0 24 24" fill="#F5A800"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z"/></svg>
          </div>
          <div class="ri-stat-text">
            <div class="ri-stat-number ri-text-orange">35,000+</div>
            <div class="ri-stat-label">全球扶輪社</div>
          </div>
        </div>

        <div class="ri-stat-divider"></div>

        <!-- 數據 3: 國際扶輪地區 -->
        <div class="ri-stat-item">
          <div class="ri-stat-icon ri-bg-cyan-light">
            <svg width="45" height="40" viewBox="0 0 24 24" fill="#1DA1F2"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>
          </div>
          <div class="ri-stat-text">
            <div class="ri-stat-number ri-text-cyan">530+</div>
            <div class="ri-stat-label">國際扶輪地區</div>
          </div>
        </div>

        <div class="ri-stat-divider"></div>

        <!-- 數據 4: 涵蓋國家及地域 -->
        <div class="ri-stat-item">
          <div class="ri-stat-icon ri-bg-teal-light">
            <svg width="45" height="40" viewBox="0 0 24 24" fill="#2CA6C4"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/></svg>
          </div>
          <div class="ri-stat-text">
            <div class="ri-stat-number ri-text-teal">200+</div>
            <div class="ri-stat-label">涵蓋國家及地域</div>
          </div>
        </div>

      </div>
    </div>

  </div>
</section>/* End custom CSS */