@charset "utf-8";
/*detail start*/
body {
    font-family: 'Playfair Display', 'Microsoft JhengHei', serif;
}

.memoirs_title_bottom {
    justify-content: center;
    margin-bottom: 0.5em;
    display: flex;
    align-items: center;
    font-size: 25px;
}

.memoirs_det_bottom {
    width: 100%;
    font-size: 28px;
    border-radius: 7px;
    background: #000000;
    border: 1px solid #000000;
    color: #ffffff;
    padding: 4px;
    text-align: center;
}

.borderstyle-bg {
    background-color: transparent;
}

.borderstyle {

    border-color: transparent;
    border-style: none;

}

.product-label {
    font-size: 25px;
    font-weight: bold;
}

.carousel-wrapper {
    position: relative;
    /* 使內部的按鈕能夠定位 */
    width: 100%;
    /* 使包裝器的寬度與容器匹配 */
    margin-left: 15px;
    /* 在左邊留出空間 */
}

.image-carousel-container {
    position: relative;
    overflow: hidden;
    width: 88%;
}

.image-carousel {
    display: flex;
    transition: transform 0.5s ease-in-out;
    white-space: nowrap;
    /* 確保所有圖片在一行顯示 */
    justify-content: flex-start;
    /* 使圖片靠左對齊 */

}

.image-container {
    width: 100px;
    /* 設定圖片容器的固定寬度 */
    height: 100px;
    /* 設定圖片容器的固定高度 */
    overflow: hidden;
    /* 隱藏超出容器的內容 */
    position: relative;
}

.image-container img {
    width: 100%;
    /* 確保圖片填滿容器的寬度 */
    height: 100%;
    /* 確保圖片填滿容器的高度 */
    object-fit: cover;
    /* 保持圖片比例，並填滿容器 */
    display: block;
}

.image-slide {
    flex: 0 0 25%;
    /* 每次顯示四個圖片，即每個佔25%寬度 */
    box-sizing: border-box;

}

.carousel-control-prev,
.carousel-control-next {
    position: absolute;
    border: none;
    /* 移除邊框 */
    width: 40px;
    /* 按鈕寬度 */
    height: 40px;
    /* 按鈕高度 */
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.35);
    color: white;
    border: none;
    padding: 10px;
    cursor: pointer;
    z-index: 10;
    border-radius: 2rem;
}

#aidTitleDiv h1:before {
    content: "";
    background: url("/images/home_img/icon_water.png");
    font-weight: bold;
    width: 33px;
    height: 46px;
    position: absolute;
    left: 35px;
    top: 15%;
}

#aidTitleDiv h1:after {
    content: "";
    background: #ccc;
    height: 1px;
    position: absolute;
    left: 75px;
    right: 0;
    display: block;
}

#aidTitle {
    padding: 5px 0 0px 60px;
    line-height: 1.2;
}

#prodInfoDiv {
    background: #f3f3f3;
    border-radius: 20px 20px;
}

#prodInfoTitle {
    padding: 3px 15px;
    font-size: 22px;
    background: #dedede;
}

#prodInfo {
    padding: 15px 15px;
}

#prodInfo h3 {
    line-height: 1.5;
    font-size: 22px;
    font-weight: 500;
}


#prodDes {
    padding: 10px 20px;
    font-size: 18px;
    color: #0066ab;
    border: 1px solid #0094de;
    border-radius: 20px;
    font-weight: 700;
}

#prodSmallDes {
    margin-left: 10px;
    color: #888;
}

#prodTypeDivTitle {
    padding: 5px;
    font-size: 20px;
    color: #0066ab;
    border: 1px solid #9bdeff;
    border-radius: 30px;
    text-align: center;
    line-height: 28px;
}

#prodTypeDes {
    padding: 10px 20px;
    color: #fff;
    background: #0094de;
    border: 1px solid #0094de;
    border-radius: 30px;
    font-weight: 700;
    display: block;
}

.hoverColor {
    font-size: 18px;
    color: #333;
    font-weight: 700;
}

.hoverColor:hover {
    font-size: 18px;
    color: #0066ab;
    font-weight: 700;
}

#prodUse {
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 700;
    border-left: 5px solid #eee;
}

.subTypeButton {
    border: 1px solid #aaa;
    border-radius: 0.1rem;
    background-color: #f7f7f7;
}

.carousel-control-prev {
    left: -42px;
}

.carousel-control-next {
    right: -10px;
}

.titleHover {
    font-size: 18px;
    color: black;
    font-weight: 700;
    cursor: pointer;

}

.titleHover:hover {
    font-size: 18px;
    color: white;
    background: black;
    font-weight: 700;
    border-radius: 5px;
    text-decoration: none;
}

@media (min-width: 1200px) {
    .h_hr {
        margin: 0 10px;
        height: 40px;
        width: 1px;
        background: #7c3400;
        float: left;
    }
}

@media (min-width: 1200px) {
    .s20c_mold {
        color: #393939;
        font-size: 20px;
        line-height: 40px;
        float: left;
    }
}
/*detail end*/