/* 全局樣式 */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* 頁面樣式 */
/* 全局樣式 */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* 頁面樣式 */
header {
    background-color: #012063;
    color: #ffffff;
    padding: 0px;
}

.banner img {
    max-width: 330px;
}

/* 媒体查询，针对手机设备，设置不同的banner图像 */
@media screen and (max-width: 767px) {
    .banner img {
        max-width: 100%; /* 设置手机设备下图像宽度为100% */
    }
    /* 添加其他针对手机设备的样式规则 */
}

/* 媒体查询，针对PC设备，设置不同的banner图像 */
@media screen and (min-width: 768px) {
    .banner img {
        max-width: 640px; /* 设置PC设备下图像宽度为640px */
    }
    /* 添加其他针对PC设备的样式规则 */
}

.product-section,
.clients-section,
.contact-section {
    background-color: #D2E9FF;
    padding: 20px;
}

h3 {
    color: #0066FF;
}

h2 {
    color: #003377;
}

/* 產品和合作客戶滑動區域樣式 */
.slider {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

.slide {
    flex-shrink: 0;
    width: 80%;
    max-width: 500px;
    margin-right: 20px;
    scroll-snap-align: start;
    position: relative;
}

.slide img {
    width: 100%;
    height: auto;
}

.slide .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s;
    cursor: pointer;
}

.slide:hover .overlay {
    opacity: 1;
}

/* 聯絡我們表單樣式 */
.contact-section form {
    /* 表單樣式 */
}