{"id":3252,"date":"2025-08-30T13:56:32","date_gmt":"2025-08-30T11:56:32","guid":{"rendered":"http:\/\/localhost:18080\/?page_id=3252"},"modified":"2025-08-30T14:22:31","modified_gmt":"2025-08-30T12:22:31","slug":"elementor-3252","status":"publish","type":"page","link":"https:\/\/www.sheerthermo.com\/ja\/elementor-3252\/","title":{"rendered":"Elementor #3252"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"3252\" class=\"elementor elementor-3252\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-089feb4 e-flex e-con-boxed e-con e-parent\" data-id=\"089feb4\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9bf738f elementor-widget elementor-widget-wp-widget-custom_html\" data-id=\"9bf738f\" data-element_type=\"widget\" data-widget_type=\"wp-widget-custom_html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"textwidget custom-html-widget\"><!-- About Us -->\r\n<div class=\"about-section\">\r\n    <div class=\"about-header\">\r\n        <h1 class=\"about-title\">\u4f01\u696d\u60c5\u5831<\/h1>\r\n        <p class=\"about-subtitle\">\u30a8\u30cd\u30eb\u30d5\u30a7\u30ed, \u81ea\u52d5\u8eca\u3078\u306e\u96fb\u529b\u4f9b\u7d66<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"about-content\">\r\n        <div class=\"company-intro\">\r\n            <h2>\u4f1a\u793e\u6982\u8981<\/h2>\r\n            <p>2013\u5e74\u306b\u8a2d\u7acb\u3055\u308c\u3001\u6211\u3005\u306f\u81ea\u52d5\u8eca\u90e8\u54c1\u306b\u7279\u5316\u3057\u305f\u5c02\u9580\u306e\u5378\u58f2\u5009\u5eab\u30b9\u30bf\u30a4\u30eb\u306e\u4f1a\u793e\u3067\u3059\u3002\u79c1\u305f\u3061\u306f\u4f55\u5343\u3082\u306e\u8eca\u3068\u81ea\u8ee2\u8eca\u306e\u30a2\u30af\u30bb\u30b5\u30ea\u30fc\u3092\u63d0\u4f9b\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\r\n            <p>\u9577\u5e74\u306b\u308f\u305f\u308b\u7d99\u7d9a\u7684\u306a\u6539\u5584\u3068\u9769\u65b0\u306b\u3088\u308a\u3001\u6700\u9069\u306a\u54c1\u8cea\u30fb\u4fa1\u683c\u30fb\u30b5\u30fc\u30d3\u30b9\u6bd4\u7387\u3067\u591a\u304f\u306e\u9867\u5ba2\u30b0\u30eb\u30fc\u30d7\u304b\u3089\u652f\u6301\u3092\u5f97\u3066\u3044\u307e\u3059\u3002\u5f53\u793e\u306e\u88fd\u54c1\u306f\u3001\u30b9\u30da\u30a4\u30f3\u3060\u3051\u3067\u306a\u304f\u3001\u30dd\u30eb\u30c8\u30ac\u30eb\u306e\u4e3b\u8981\u90fd\u5e02\u3067\u3082\u8ca9\u58f2\u3055\u308c\u3066\u3044\u307e\u3059\u3002\u5c06\u6765\u7684\u306b\u306f\u3001Shengbo\u81ea\u52d5\u8eca\u90e8\u54c1\u306f\u3001\u5f15\u304d\u7d9a\u304d\u6280\u8853\u9769\u65b0\u306b\u52aa\u3081\u3001\u4ed6\u306e\u6b27\u5dde\u8af8\u56fd\u306b\u591a\u304f\u306e\u9ad8\u54c1\u8cea\u306e\u88fd\u54c1\u3092\u8ca9\u58f2\u3057\u307e\u3059\u3002<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"business-philosophy\">\r\n            <h2>\u7d4c\u55b6\u7406\u5ff5<\/h2>\r\n            <p>\u30a8\u30cd\u30eb\u30d5\u30a7\u30ed\u306f\u3001\u300c\u79d1\u5b66\u7684\u7ba1\u7406\u3092\u901a\u3058\u3066\u5229\u76ca\u3092\u5275\u9020\u3057\u3001\u9ad8\u54c1\u8cea\u306e\u30b5\u30fc\u30d3\u30b9\u3092\u901a\u3058\u3066\u767a\u5c55\u3092\u6c42\u3081\u308b\u300d\u3068\u3044\u3046\u539f\u5247\u3092\u5805\u6301\u3057\u3001\u9ad8\u54c1\u8cea\u3001\u9ad8\u30b5\u30fc\u30d3\u30b9\u3001\u591a\u30ab\u30c6\u30b4\u30ea\u30fc\u306e\u30de\u30fc\u30b1\u30c6\u30a3\u30f3\u30b0\u6226\u7565\u3092\u5b9f\u65bd\u3057\u3001\u30e6\u30fc\u30b6\u30fc\u3092\u7372\u5f97\u3057\u3001\u5e02\u5834\u3092\u5360\u6709\u3057\u3001\u5e02\u5834\u306e\u30ae\u30e3\u30c3\u30d7\u3092\u767a\u898b\u3057\u3001\u5bfe\u7b56\u3092\u898b\u3064\u3051\u3001\u300c3\u3064\u306e\u6e80\u8db3\u300d\u3001\u3059\u306a\u308f\u3061\u300c\u54c1\u8cea\u6e80\u8db3\u3001\u30b5\u30fc\u30d3\u30b9\u6e80\u8db3\u3001\u30ab\u30c6\u30b4\u30ea\u30fc\u6e80\u8db3\u300d\u306e\u65b9\u91dd\u3092\u5b9f\u884c\u3057\u3001\u9867\u5ba2\u306e\u30cb\u30fc\u30ba\u3092\u91cd\u8996\u3057\u3001\u5e02\u5834\u306e\u5909\u5316\u306b\u9069\u5fdc\u3059\u308b\u30de\u30fc\u30b1\u30c6\u30a3\u30f3\u30b0\u65b9\u91dd\u3092\u7b56\u5b9a\u3057\u3001\u3055\u307e\u3056\u307e\u306a\u9867\u5ba2\u30b0\u30eb\u30fc\u30d7\u3092\u6e80\u8db3\u3055\u305b\u3001\u6f5c\u5728\u7684\u306a\u30e6\u30fc\u30b6\u30fc\u3092\u7a4d\u6975\u7684\u306b\u958b\u62d3\u3057\u3066\u3044\u308b\u3002<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"gallery-section\">\r\n            <h2>\u88fd\u54c1\u30b7\u30e7\u30fc\u30b1\u30fc\u30b9<\/h2>\r\n            <p>ENERFERO\u793e\u306f\u3001\u304a\u5ba2\u69d8\u304c\u3088\u308a\u5feb\u9069\u306b\u3001\u3088\u308a\u65e9\u304f\u3001\u3088\u308a\u5b8c\u5168\u306b\u5546\u54c1\u3092\u9673\u5217\u3067\u304d\u308b\u3088\u3046\u3001\u7f8e\u89b3\u306b\u512a\u308c\u3001\u5feb\u9069\u306a\u5c02\u7528\u5546\u54c1\u30c7\u30a3\u30b9\u30d7\u30ec\u30a4\u3092\u63d0\u4f9b\u3057\u3066\u3044\u307e\u3059\u3002\u307e\u305f\u3001\u68da\u306e\u30d7\u30e9\u30f3\u30cb\u30f3\u30b0\u3001\u30c7\u30b6\u30a4\u30f3\u3001\u6539\u88c5\u3001\u8a2d\u7f6e\u30b5\u30fc\u30d3\u30b9\u3082\u63d0\u4f9b\u3057\u3066\u304a\u308a\u3001\u9700\u8981\u306b\u5fdc\u3058\u3066\u9673\u5217\u3055\u308c\u305f\u5404\u5546\u54c1\u3092\u914d\u7f6e\u3057\u3001\u5e97\u8217\u306b\u512a\u308c\u305f\u30b5\u30fc\u30d3\u30b9\u3092\u63d0\u4f9b\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\r\n\r\n            <div class=\"multi-image-carousel\">\r\n                <div class=\"carousel-track\">\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Product Display\">\r\n                        <div class=\"item-caption\">\u696d\u52d9\u7528\u88fd\u54c1\u30c7\u30a3\u30b9\u30d7\u30ec\u30a4<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Auto Parts\">\r\n                        <div class=\"item-caption\">\u30d7\u30ec\u30df\u30a2\u30e0\u30fb\u30aa\u30fc\u30c8\u30d1\u30fc\u30c4<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Store Display\">\r\n                        <div class=\"item-caption\">\u30e2\u30c0\u30f3\u306a\u5e97\u8217\u30c7\u30a3\u30b9\u30d7\u30ec\u30a4<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Product Series\">\r\n                        <div class=\"item-caption\">\u5b8c\u5168\u306a\u88fd\u54c1\u30b7\u30ea\u30fc\u30ba<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Professional Service\">\r\n                        <div class=\"item-caption\">\u30d7\u30ed\u30d5\u30a7\u30c3\u30b7\u30e7\u30ca\u30eb\u30fb\u30c6\u30af\u30cb\u30ab\u30eb\u30fb\u30b5\u30fc\u30d3\u30b9<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Wheel Series\">\r\n                        <div class=\"item-caption\">\u30d7\u30ec\u30df\u30a2\u30e0\u30db\u30a4\u30fc\u30eb\u30b7\u30ea\u30fc\u30ba<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Brake System\">\r\n                        <div class=\"item-caption\">\u30d7\u30ec\u30df\u30a2\u30e0\u30fb\u30d6\u30ec\u30fc\u30ad\u30fb\u30b7\u30b9\u30c6\u30e0<\/div>\r\n                    <\/div>\r\n                    <div class=\"carousel-item\">\r\n                        <img decoding=\"async\" src=\"https:\/\/www.sheerthermo.com\/wp-content\/uploads\/2025\/08\/IMG-1047-e1675856809120.jpg\" alt=\"Engine Parts\">\r\n                        <div class=\"item-caption\">\u30a8\u30f3\u30b8\u30f3\u90e8\u54c1<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <button class=\"nav-btn prev-btn\">&#10094;<\/button>\r\n                <button class=\"nav-btn next-btn\">&#10095;<\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n\r\n\r\n    <\/div>\r\n<\/div>\r\n\r\n\r\n\/* \u5bfc\u5165Google\u5b57\u4f53 *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&amp;family=Poppins:wght@400;500;600;700&amp;display=swap');\r\n\r\n\/* \u5168\u5c40\u6837\u5f0f\u91cd\u7f6e\u548c\u57fa\u7840\u8bbe\u7f6e *\/\r\n* {\r\n    box-sizing: border-box;\r\n}\r\n\r\n.about-section {\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    padding: 60px 20px;\r\n    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\r\n    line-height: 1.7;\r\n    color: #2c3e50;\r\n    min-height: 100vh;\r\n}\r\n\r\n.about-header {\r\n    text-align: center;\r\n    margin-bottom: 80px;\r\n    padding: 40px 0;\r\n    position: relative;\r\n}\r\n\r\n.about-header::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 80px;\r\n    height: 4px;\r\n    background: linear-gradient(90deg, #3498db, #2980b9);\r\n    border-radius: 2px;\r\n}\r\n\r\n.about-title {\r\n    font-family: 'Poppins', sans-serif;\r\n    font-size: clamp(2.5rem, 5vw, 3.5rem);\r\n    color: #1a252f;\r\n    margin-bottom: 16px;\r\n    font-weight: 700;\r\n    letter-spacing: -0.02em;\r\n    background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%);\r\n    -webkit-background-clip: text;\r\n    -webkit-text-fill-color: transparent;\r\n    background-clip: text;\r\n    text-shadow: 0 4px 8px rgba(0,0,0,0.1);\r\n}\r\n\r\n.about-subtitle {\r\n    font-size: 1.3rem;\r\n    color: #64748b;\r\n    font-weight: 400;\r\n    font-style: normal;\r\n    margin-top: 16px;\r\n    opacity: 0.9;\r\n    letter-spacing: 0.5px;\r\n}\r\n\r\n\/* \u5185\u5bb9\u533a\u57df\u6837\u5f0f *\/\r\n.about-content {\r\n    display: grid;\r\n    gap: 60px;\r\n}\r\n\r\n.company-intro,\r\n.business-philosophy,\r\n.gallery-section {\r\n    background: rgba(255, 255, 255, 0.8);\r\n    backdrop-filter: blur(10px);\r\n    border-radius: 20px;\r\n    padding: 40px;\r\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);\r\n    border: 1px solid rgba(255, 255, 255, 0.2);\r\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\n.company-intro::before,\r\n.business-philosophy::before,\r\n.gallery-section::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    right: 0;\r\n    height: 4px;\r\n    background: linear-gradient(90deg, #3498db, #e74c3c, #f39c12, #27ae60);\r\n    border-radius: 20px 20px 0 0;\r\n}\r\n\r\n.company-intro:hover,\r\n.business-philosophy:hover,\r\n.gallery-section:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.about-content h2 {\r\n    font-family: 'Poppins', sans-serif;\r\n    font-size: 2rem;\r\n    color: #1a252f;\r\n    margin: 0 0 24px 0;\r\n    font-weight: 600;\r\n    letter-spacing: -0.01em;\r\n    position: relative;\r\n    padding-bottom: 16px;\r\n}\r\n\r\n.about-content h2::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 0;\r\n    width: 60px;\r\n    height: 3px;\r\n    background: linear-gradient(90deg, #3498db, #2980b9);\r\n    border-radius: 2px;\r\n}\r\n\r\n.company-intro p,\r\n.business-philosophy p,\r\n.gallery-section p {\r\n    font-size: 1.125rem;\r\n    line-height: 1.8;\r\n    margin-bottom: 20px;\r\n    color: #475569;\r\n    font-weight: 400;\r\n    text-align: left;\r\n}\r\n\r\n\/* \u4f18\u5316\u7684\u591a\u56fe\u7247\u8f6e\u64ad\u6837\u5f0f *\/\r\n.multi-image-carousel {\r\n    position: relative;\r\n    max-width: 100%;\r\n    margin: 40px 0;\r\n    overflow: hidden;\r\n    padding: 0 70px;\r\n    background: transparent;\r\n}\r\n\r\n.carousel-track {\r\n    display: flex;\r\n    gap: 24px;\r\n    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    padding: 20px 0;\r\n}\r\n\r\n.carousel-item {\r\n    flex: 0 0 300px;\r\n    position: relative;\r\n    border-radius: 16px;\r\n    overflow: hidden;\r\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    background: white;\r\n    border: 1px solid rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.carousel-item:hover {\r\n    transform: translateY(-8px) scale(1.02);\r\n    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.2);\r\n}\r\n\r\n.carousel-item img {\r\n    width: 100%;\r\n    height: 220px;\r\n    object-fit: cover;\r\n    display: block;\r\n    transition: transform 0.4s ease;\r\n}\r\n\r\n.carousel-item:hover img {\r\n    transform: scale(1.05);\r\n}\r\n\r\n.item-caption {\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 0;\r\n    right: 0;\r\n    background: linear-gradient(transparent, rgba(26, 37, 47, 0.95));\r\n    color: white;\r\n    padding: 24px 20px 18px;\r\n    font-size: 1.1rem;\r\n    font-weight: 500;\r\n    text-align: center;\r\n    font-family: 'Poppins', sans-serif;\r\n    letter-spacing: 0.3px;\r\n    backdrop-filter: blur(8px);\r\n}\r\n\r\n\/* \u4f18\u5316\u7684\u5bfc\u822a\u6309\u94ae *\/\r\n.nav-btn {\r\n    position: absolute;\r\n    top: 50%;\r\n    transform: translateY(-50%);\r\n    background: rgba(255, 255, 255, 0.95);\r\n    backdrop-filter: blur(12px);\r\n    border: none;\r\n    width: 56px;\r\n    height: 56px;\r\n    border-radius: 50%;\r\n    font-size: 20px;\r\n    color: #2c3e50;\r\n    cursor: pointer;\r\n    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n    z-index: 10;\r\n    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    border: 2px solid rgba(52, 152, 219, 0.2);\r\n}\r\n\r\n.nav-btn:hover {\r\n    background: linear-gradient(135deg, #3498db, #2980b9);\r\n    color: white;\r\n    transform: translateY(-50%) scale(1.1);\r\n    box-shadow: 0 12px 32px rgba(52, 152, 219, 0.4);\r\n    border-color: transparent;\r\n}\r\n\r\n.nav-btn:active {\r\n    transform: translateY(-50%) scale(0.95);\r\n}\r\n\r\n.prev-btn {\r\n    left: 15px;\r\n}\r\n\r\n.next-btn {\r\n    right: 15px;\r\n}\r\n\r\n\r\n\r\n@media (max-width: 768px) {\r\n    .about-title {\r\n        font-size: 2rem;\r\n    }\r\n\r\n    .multi-image-carousel {\r\n        padding: 0 40px;\r\n    }\r\n\r\n    .carousel-item {\r\n        flex: 0 0 250px;\r\n    }\r\n\r\n    .carousel-item img {\r\n        height: 180px;\r\n    }\r\n\r\n    .item-caption {\r\n        padding: 15px 12px 12px;\r\n        font-size: 0.9rem;\r\n    }\r\n\r\n    .nav-btn {\r\n        width: 40px;\r\n        height: 40px;\r\n        font-size: 20px;\r\n    }\r\n\r\n    .prev-btn {\r\n        left: 5px;\r\n    }\r\n\r\n    .next-btn {\r\n    right: 5px;\r\n}\r\n\r\n\r\n\r\n\/* \u4f18\u5316\u7684\u79fb\u52a8\u7aef\u54cd\u5e94\u5f0f\u8bbe\u8ba1 *\/\r\n@media (max-width: 768px) {\r\n    .about-section {\r\n        padding: 40px 16px;\r\n    }\r\n\r\n    .about-header {\r\n        margin-bottom: 60px;\r\n        padding: 30px 0;\r\n    }\r\n\r\n    .about-header::before {\r\n        width: 60px;\r\n        height: 3px;\r\n    }\r\n\r\n    .about-title {\r\n        font-size: clamp(2rem, 8vw, 2.8rem);\r\n        margin-bottom: 12px;\r\n    }\r\n\r\n    .about-subtitle {\r\n        font-size: 1.1rem;\r\n        margin-top: 12px;\r\n    }\r\n\r\n    .about-content {\r\n        gap: 40px;\r\n    }\r\n\r\n    .company-intro,\r\n    .business-philosophy,\r\n    .gallery-section {\r\n        padding: 30px 24px;\r\n        border-radius: 16px;\r\n    }\r\n\r\n    .about-content h2 {\r\n        font-size: 1.6rem;\r\n        margin-bottom: 20px;\r\n    }\r\n\r\n    .about-content h2::after {\r\n        width: 50px;\r\n        height: 2px;\r\n    }\r\n\r\n    .company-intro p,\r\n    .business-philosophy p,\r\n    .gallery-section p {\r\n        font-size: 1rem;\r\n        line-height: 1.7;\r\n        margin-bottom: 16px;\r\n    }\r\n\r\n    .multi-image-carousel {\r\n        padding: 0 50px;\r\n        margin: 30px 0;\r\n    }\r\n\r\n    .carousel-item {\r\n        flex: 0 0 260px;\r\n    }\r\n\r\n    .carousel-item img {\r\n        height: 180px;\r\n    }\r\n\r\n    .item-caption {\r\n        padding: 18px 16px 14px;\r\n        font-size: 0.95rem;\r\n    }\r\n\r\n    .nav-btn {\r\n        width: 48px;\r\n        height: 48px;\r\n        font-size: 18px;\r\n    }\r\n\r\n    .prev-btn {\r\n        left: 8px;\r\n    }\r\n\r\n    .next-btn {\r\n        right: 8px;\r\n    }\r\n\r\n\r\n}\r\n\r\n\/* \u8d85\u5c0f\u5c4f\u5e55\u4f18\u5316 *\/\r\n@media (max-width: 480px) {\r\n    .about-section {\r\n        padding: 30px 12px;\r\n    }\r\n\r\n    .multi-image-carousel {\r\n        padding: 0 40px;\r\n    }\r\n\r\n    .carousel-item {\r\n        flex: 0 0 240px;\r\n    }\r\n\r\n    .nav-btn {\r\n        width: 44px;\r\n        height: 44px;\r\n        font-size: 16px;\r\n    }\r\n\r\n    .company-intro,\r\n    .business-philosophy,\r\n    .gallery-section {\r\n        padding: 24px 20px;\r\n    }\r\n\r\n\r\n}\r\n\r\n\r\n\r\nlet currentPosition = 0;\r\nconst carouselTrack = document.querySelector('.carousel-track');\r\nconst carouselItems = document.querySelectorAll('.carousel-item');\r\nconst itemWidth = 300; \/\/ \u6bcf\u4e2a\u9879\u76ee\u5bbd\u5ea6 + \u95f4\u8ddd\r\nconst visibleItems = 3; \/\/ \u540c\u65f6\u663e\u793a\u7684\u9879\u76ee\u6570\u91cf\r\nconst maxPosition = -(carouselItems.length - visibleItems) * itemWidth;\r\n\r\nfunction scrollLeft() {\r\n    if (currentPosition  maxPosition) {\r\n        currentPosition -= itemWidth;\r\n        carouselTrack.style.transform = `translateX(${currentPosition}px)`;\r\n    }\r\n}\r\n\r\n\/\/ \u81ea\u52a8\u6eda\u52a8\r\nlet autoScrollInterval = setInterval(() =&gt; {\r\n    if (currentPosition &gt; maxPosition) {\r\n        scrollRight();\r\n    } else {\r\n        \/\/ \u56de\u5230\u5f00\u59cb\u4f4d\u7f6e\r\n        currentPosition = 0;\r\n        carouselTrack.style.transform = `translateX(0px)`;\r\n    }\r\n}, 5000);\r\n\r\n\/\/ \u9f20\u6807\u60ac\u505c\u65f6\u6682\u505c\u81ea\u52a8\u6eda\u52a8\r\nconst multiImageCarousel = document.querySelector('.multi-image-carousel');\r\nmultiImageCarousel.addEventListener('mouseenter', () =&gt; {\r\n    clearInterval(autoScrollInterval);\r\n});\r\n\r\nmultiImageCarousel.addEventListener('mouseleave', () =&gt; {\r\n    autoScrollInterval = setInterval(() =&gt; {\r\n        if (currentPosition &gt; maxPosition) {\r\n            scrollRight();\r\n        } else {\r\n            currentPosition = 0;\r\n            carouselTrack.style.transform = `translateX(0px)`;\r\n        }\r\n    }, 4000);\r\n});\r\n\r\n\/\/ \u89e6\u6478\u6ed1\u52a8\u652f\u6301\r\nlet startX = 0;\r\nlet isDragging = false;\r\n\r\ncarouselTrack.addEventListener('touchstart', (e) =&gt; {\r\n    startX = e.touches[0].clientX;\r\n    isDragging = true;\r\n    clearInterval(autoScrollInterval);\r\n});\r\n\r\ncarouselTrack.addEventListener('touchmove', (e) =&gt; {\r\n    if (!isDragging) return;\r\n    const currentX = e.touches[0].clientX;\r\n    const diffX = startX - currentX;\r\n\r\n    if (Math.abs(diffX) &gt; 50) {\r\n        if (diffX &gt; 0) {\r\n            scrollRight();\r\n        } else {\r\n            scrollLeft();\r\n        }\r\n        isDragging = false;\r\n    }\r\n});\r\n\r\ncarouselTrack.addEventListener('touchend', () =&gt; {\r\n    isDragging = false;\r\n});\r\n\r\n\/\/ \u952e\u76d8\u5bfc\u822a\r\ndocument.addEventListener('keydown', (e) =&gt; {\r\n    if (e.key === 'ArrowLeft') {\r\n        scrollLeft();\r\n    } else if (e.key === 'ArrowRight') {\r\n        scrollRight();\r\n    }\r\n}); \/\/ End of keydown event listener\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3252","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/pages\/3252","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/comments?post=3252"}],"version-history":[{"count":10,"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/pages\/3252\/revisions"}],"predecessor-version":[{"id":3274,"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/pages\/3252\/revisions\/3274"}],"wp:attachment":[{"href":"https:\/\/www.sheerthermo.com\/ja\/wp-json\/wp\/v2\/media?parent=3252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}