/* 線上展覽 image-idea 區塊：與重構前視覺一致（IOT、化學品交易等） */

#section-01.image-idea {
    width: 100%;
    height: 612px;
    position: relative;
    padding-bottom: 80px;
    display: flow-root;
    clear: both;
    overflow: visible;
}

@media (max-width: 980px) {
    #section-01.image-idea {
        height: auto;
        min-height: 612px;
        padding: 0 0 50px 0;
    }
}

.image-idea {
    background-image: url("../images/bg-idea-section-1.png");
    background-position: center bottom;
    background-repeat: no-repeat;
}

#section-01.image-idea .iot-diagram-card {
    width: 682.5px;
    max-width: 100%;
    height: 474.05px;
    box-sizing: border-box;
    padding: 14px 18px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

#section-01.image-idea .iot-diagram-card figure {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    margin: 0;
}

#section-01.image-idea .iot-diagram-media {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

#section-01.image-idea .iot-diagram-media img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center center;
}

#section-01 figure figcaption,
#section-01.image-idea .iot-diagram-card figcaption {
    flex: 0 0 auto;
    color: #666;
    line-height: 1.4;
    margin-top: 8px;
    text-align: justify;
}

/* AI 視覺辨識：主內容白底區塊（與重構前 .card-number 外層一致） */
#section-01.image-idea > .container > .card-number.MT30,
#section-01.image-idea.image-idea--fluid > .container > .card-number-wrapper {
    width: 100%;
    box-sizing: border-box;
    float: left;
}

/* AI 視覺辨識等長內容頁：綠色底圖維持與重構前（線上版）一致 ——
   cover 滿版、固定 612px 綠帶（center bottom）。
   內文以浮動方式向下延伸，取消上層的 flow-root，改交由 .wrapper 的 BFC
   （main.css 的 .wrapper{overflow:hidden}）包覆撐高，把 footer 推到內文之後，
   避免最後段落被 footer 截斷。 */
#section-01.image-idea.image-idea--fluid {
    height: 612px;
    background-size: cover;
    display: block; /* 覆寫上方 #section-01.image-idea 的 flow-root，讓浮動內文交由 .wrapper 包覆 */
    overflow: visible;
}

#exhibtion-section-03 {
    padding: 50px 0;
    background-color: #fff;
    position: relative;
    z-index: 1;
}
