footer{
    color: #b8a58b;
}


span.indexline {
    display: inline-block;
    border-right: 1px solid #37553c;
    padding-right: 15px;
}
.imgpagt5{
    width: 100%;
    height: 100%;
}
h3.blodd{
    font-weight: 800!important;
    letter-spacing: 2px;
}

.text-en00{
    border-bottom: 1px solid #896049;
    margin-bottom: 10px;
    padding-bottom: 15px;
    
}

.footerbox{
    background-color: #3c5443;
    color: #b8a58b;
}
.footerlink a{
    padding: 0 8px;
    display: inline-block;
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); 
}
.footerlink a:hover{
    padding: 0 8px;
    transform: translateY(-8px);
}
.footerlink a img{
    max-width: 60px;
    vertical-align: middle;
    transition: transform 0.3s ease;
}

.footer01 a{
    color: #b8a58b!important;
    text-decoration: none;
    padding: 0 5px;
}



.durian-char-img03 {
  /* animation: 動畫名稱 持續時間 速度曲線 播放次數 */
  animation: spin 7s linear infinite;
}

/* 定義 360 度旋轉的動畫 */
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}


/* ==========================================================================
   野日 NOHI - 榴槤市集企劃客製化 CSS
   ========================================================================== */

/* --- 全域與主容器設定 --- */
.durian-main-wrapper {
    /* 確保字體統一使用明體/宋體以符合日系/文青感 */
    font-family: 'Noto Serif TC', 'Noto Serif JP', serif;
    color: #2b3a2f; /* 深墨綠色文字，比純黑更柔和 */
}

/* 內文段落基礎設定 */
.durian-text-sm {
    font-size: 1rem;
    line-height: 2;
    letter-spacing: 0.08rem;
    color: #603c26;
     font-family: 'Noto Sans TC', sans-serif;
}

.durian-text-sm p {
    margin-bottom: 1.5rem;
}

/* 英文內文特定設定 */
.text-en {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 0.85rem;
    letter-spacing: 0.05rem;
}

.english-typography p {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 0.9rem;
    line-height: 1.8;
    letter-spacing: 0.05rem;
    margin-bottom: 1.5rem;
    color: #37553c;
}

/* --- Section 1: Hero 主視覺微調 --- */
/* 插圖飄浮動畫(可選，增加趣味性) */
.floating-anim {
    animation: float 6s ease-in-out infinite;
}

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-80px); }
    100% { transform: translateY(0px); }
}

.durian-char-img {
    max-width: 80%;
    margin-bottom: -20px; /* 讓插圖跟下方海報微微重疊 */
}

/* ==========================================================================
   Durian Market 頁面專屬客製化 CSS 補充
   ========================================================================== */

/* 確保容器沒有不必要的溢位 */
.durian-main-wrapper {
    overflow-x: hidden;
}

/* 突破 Bootstrap Container 限制的滿版圖片寫法 (完全貼齊螢幕邊緣) */
.full-bleed-img-wrapper {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

/* 右側邊緣絕對定位的英文裝飾字 */
.durian-side-deco-text {
    top: 2rem;
    right: 1.5rem;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 0.85rem;
    letter-spacing: 0.2rem;
    color: rgba(255, 255, 255, 0.4); /* 半透明白色融入背景 */
    height: 100%;
    max-height: 90vh;
    pointer-events: none; /* 避免干擾點擊 */
}
.durian-side-deco-text span{
    color: #603c26;
}

/* Hero 區塊的日文垂直標題 */
.durian-vertical-title {
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-family: 'Noto Serif JP', 'Noto Serif TC', serif;
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: 0.5rem;
    color: var(--text-color, #37553c);
    line-height: 1.5;
    /* 加入一點微傾斜與陰影增加活潑感 (可選) */
    transform: rotate(2deg);
    text-shadow: 2px 2px 0px rgba(255, 255, 255, 0.5);
}

/* 微調字距與行高使其更符合日系文青感 */
.durian-text-sm p {
    text-align: justify;
    margin-bottom: 2rem;
}

.english-typography p {
    text-align: justify;
}

/* 確保圖片陰影質感一致 */
.shadow-sm {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
}

/* 針對較小螢幕的微調 */
@media (max-width: 767.98px) {
    .durian-vertical-title {
        writing-mode: horizontal-tb;
        text-orientation: mixed;
        font-size: 1.8rem;
        margin-bottom: 1rem;
        transform: none;
        text-align: center;
    }
    
    .full-bleed-img-wrapper {
        margin-bottom: 2rem !important;
    }
}


  @media (min-width: 768px) {
      .warmth-full-width {
        margin-left: -3rem;
        margin-right: -3rem;
          
          
      }

      
  }