@media (max-width: 769px) {
    * {
        box-sizing:border-box;
    }
    .main {
        width:100%;
    }
    .main-content {
        width:100%;
        float:initial;
        padding:10px;
    }
    img {
        max-width:100%;
    }
    .header1_top {
        display:none;
    }
    #header1 {
        text-align: center;
        background-image: url('/images/home/Header/Header.png');
        background-color:#bfd0a6;
        background-position: right top; /* 靠右居中 */
        background-size: 190% auto;
        height:142px;
    }
    .logo {
        position: absolute;
        margin-top: 5px;
        width: 110px;
        bottom: 2px;
        top:initial;
        left:80px;
    }
    .header1_search {
        float:initial;
    }
    #header1 a.header1_cart {
        margin: 10px 10px 0 0;
        right: 2px;
        left:initial;
        width:135px;
        top:initial;
        bottom: 15px;
    }
    #header1 .header1_search {
        margin:5px 5px 0 0;
    }
    .header1_right {
        margin-bottom:5px;
    }
    .header1_search img {
        width:80%;
    }
    #header1 .header1_bar {
        position: initial;
        display: none;
    }
    .leftcontainer {
        display:none;
        float:initial;
        padding-right:10px;
    }
    .homebanner {
        width:100%;
    }
    .header1_search input {
        height:20px;
    }
    .brandbox {
        width: 100%;
        box-sizing: border-box;
    }
    .gate-operator .grid {
        grid-template-columns: 1fr;
    }

    .gate-operator .span-2 {
        grid-column: span 1;
    }
    .imgcir {
        width: 90px;
    }
    .imgcira {
        width:90px;
        margin-left:-45px;
        margin-top:-40px;
    }
    .homebanner1 {
        width:100%;
    }
    .footer-links {
    }
    .footer-links a {
        white-space: nowrap;
    }
    .footer1_copy {
        float:none;
        padding:5px 10px;
    }
    .copyright {
        float: none;
        padding: 5px 10px;
    }
    .footer_time, .footer1_bottom {
        height: auto;
    }
    .certifications {
        gap: 10px;
        padding: 10px 0 10px;
    }
    .titlebar {
        width: 100%;
        display: block;
    }
    .titlebar-left {
        margin-bottom:10px;
    }
    .titlebar-nav {
        line-height:20px;
    }
    .pro-item {
        display: flex;
        flex-direction: column; /* 改为上下结构 */
    }
    .main-content > table {
        width:initial;
    }
    .contentblock {
        margin-right: 0;
    }
    /* 上半部分（图片 + 按钮）左右排列 */
    .pro-item .listproimg-td {
        display: inline-block;
        vertical-align: top;
        text-align: center;
    }

        .pro-item .pro-item-actions {
            display: inline-block;
            vertical-align: top;
            text-align: right;
            line-height:28px;
        }

        /* 包个容器：上面两块左右排列 */
        .pro-item .listproimg-td,
        .pro-item .pro-item-actions {
            display: inline-block;
            height:auto;
        }

        /* 下半部分（描述）整行显示 */
        .pro-item .pro-item-desc {
            width: 100%;
            padding:0 10px;
            margin-top: 0px;
        }
    .prolistwrap {
        width:100%;
    }
    .pro-item-desc table {
        max-width:100%;
    }
    .accu_content, .accu_header {
        width: 100%;
        margin:0;
    }
    .qty-input {
        height:23px;
    }
    .qa-container {
        width:100%;
    }
        .qa-container .qa-rep {
            width: 25%;
            margin-right: 0;
        }
    .qa-container .qa-detail {
        width:75%;
        padding-left:15px;
    }
    .list-actions {
        width:130px;
    }
    .pro-list-tb td.pro-img-td {
        height:auto;
        width:85px;
    }
    .pro-list-tb td.pro-info-td {
        width:auto;
        padding-left:0;
    }
    .prod-info {
        flex-direction: column;
    }

        .prod-info .prod-img,
        .prod-info .prod-rinfo {
            flex: 0 0 100%;
            width: 100%;
        }
    .desccontent table {
        width: 100% !important; /* 强制让表格宽度自适应 */
        max-width: 100% !important; /* 防止超出容器 */
        border-collapse: collapse;
        table-layout: auto;
    }
    .reviews .leftblock {
        width:100%; 
    }
    .rating-review-header {
        width:22%;
    }
    .rating-right {
        width:77%;
        margin-left:0;
        padding-left:20px;
    }
    .desccontent {
        padding:0 8px;
    }
    .mobile-menu-btn {
        display: block;
        position: absolute;
        bottom: 25px;
        left: 10px;
    }
    .leftcontainer {
        width:100%;
    }
    .leftnavads {
        display:none;
    }
    .leftflex {
        display: flex;
        justify-content: space-between
    }
    .lineheightm18, .gatePartList {
        line-height: 24px;
    }
    .product-manuals ul li {
        padding:4px 0;
    }
    .width770, .wid500 {
        width: 100%;
    }
    .page-content-container {
        width:100%;
    }
    .tdactions img {
        display:none;
    }
    .pro-list-tb {
        width:100%;
    }
    .tdactions {
        width:90px;
        line-height:30px;
    }
    .aboutusbg {
        flex-direction:column;
    }
    .aboutustxt {
        width:100%;
    }
    .design-your-gate-box {
        width:100%;
    }
    .width500, ul.design-your-gates-tabs {
        width: 100%;
    }
    .pro-item .pro-item-actions {
        text-align: center;
        margin-top: 10px;
        width: 80%;
    }

        .pro-item-actions > span {
            display: block;
            text-align: center;
            font-size: 18px;
        }

        .pro-item-actions > div {
            display: flex;
            justify-content: center;
            align-items: center;
            text-align: center;
            width: 100% !important;
        }
            .pro-item-actions > div div {
                margin-right:10px;
            }


            .pro-item-actions a.linkbutton2 {
                flex: 1;
                text-align: left;
            }

        .pro-item-actions a.linkbutton1 {
            flex: 1;
            text-align: left;
        }
    .estate-swing .estate-swing-desc {
        width:100%;
        height:auto;
        overflow:initial;
    }
    .img100 {
        max-width:100%;
    }
    .accessoriesvideo {
        width:100%;
        height:300px;
    }
    .apollologo #tabbox {
        width:100%;
    }
    .apollologo .tabs {
        height:initial;

    }
        .apollologo .tabs:after {
            content:'';
            display:block;
            clear:both;
        }
    .apollo-box, .apollo-box-more {
        height:initial;
        width:initial;
    }
    .warranty {
        padding-left:0;
    }
    .col_2_border {
        width:100%;
        display:block;
        border-right:none;
    }
    .mobiletb {
        width:100%;
        overflow-x:scroll;
    }
    .packagediv {
        width: 100%;
    }
    .eventrepeat {
        width:100%;
    }
    .desccontent div {
        max-width: 100% !important;
        height: initial !important;
        width: initial !important;
    }
        .desccontent div.glossary-pop {
            width: 225px !important;
            max-width:initial !important;
        }
        .desccontent iframe {
            width: initial !important;
            max-width: 100%;
        }
    #chatBeaconBtn {
        right: 10px;
        bottom: 10px;
    }
    #backtop {
        right: 20px;
    }
    #chatBeaconBtn {
        right: 20px !important;
        bottom: 20px !important;
        width:50px !important;
    }
        #chatBeaconBtn img {
            width:50px !important;
        }
    .gatedesignvideo {
        width: 100%;
        height: 250px;
    }
    .gate-option {
        width: 50%;
        margin: 10px auto;
    }

    .shipping-time {
        font-size: 16px;
        margin-bottom: 5px;
        left: 0;
        width: 100%;
    }

    .gatequotenew .row3 .start-icon {
        width: 85px;
        top: 32px !important;
    }
    .gatequotenew .row3 {
        padding-bottom:20px;
    }
    #flyout li span {
        width:100%;
    }
    #flyout {
        position:initial;
        width:100%;
    }
    ul#flyout li {
        width: 100%;
        position: relative;
        z-index:initial;
    }
    #flyout #flyoutLi2_ul, #flyout #flyoutLi3_ul, #flyout #flyoutLi4_ul, #flyout #flyoutLi5_ul, #flyout #flyoutLi6_ul, #flyout #flyoutLi1_ul {
        left: 0;
        top: 0;
        width: 100%;
        height:initial;
    }
    #flyoutLi5_ul .intomore {
        width:150px;
    }
     li.sub-title2 {
        margin-bottom:8px !important;
    }
    #flyoutLi6_ul .menu-accessories-img {
        width:170px;
    }
    #flyoutLi4_ul .intomore {
        width:180px;
    }
    #flyoutLi3_ul > li > em:first-child, #flyoutLi3_ul > li > em:last-child {
        width:46%;
    }
    #flyout #flyoutLi3_ul {
        background: url(images/Why_Choose_Our_Gates-_Opener_Accessories_Menu_Ad_PNG.png) #fff right bottom no-repeat;
        background-size: 70% auto;
    }
    #flyout #flyoutLi2_ul {
        background: url(images/Why-Choose-Our-Gates-Menu-Ad.png) #fff right top no-repeat;
        background-size: 70%;
    }
    #flyout #flyoutLi1_ul {
        background-size: 100% auto;
    }
    .titlebar-nav a {
        width: 40%;
        display: inline-block;
    }
    .quicklinks {
        padding-left:0px;
    }
        .quicklinks li {
            list-style:none;
            width:48%;
            margin:4px 0;
            white-space:nowrap;
            overflow:hidden;
        }
        .quicklinks li:nth-child(even) {
            float: right;
        }
    .mobileclear {
        clear:both;
    }
    .pro-livechat {
        float:initial;
        width: 100%;
        padding-right:0;
    }
}

/* -------------------------------------------------------------------
 * 3. 中型设备 (Medium Devices)
 * 例如：普通平板
 * 屏幕宽度 >= 768px 时应用
 * ------------------------------------------------------------------- */
@media (min-width: 768px) {
    body {
    }

    .container {
        max-width: 720px;
    }

    /* 在平板上，元素可以并排显示 */
    .column {
        float: left;
        width: 50%;
    }
   
}

/* -------------------------------------------------------------------
 * 4. 大型设备 (Large Devices)
 * 例如：桌面电脑
 * 屏幕宽度 >= 992px 时应用
 * ------------------------------------------------------------------- */
@media (min-width: 992px) {
    body {
    }

    .container {
    }
}

/* -------------------------------------------------------------------
 * 5. 超大型设备 (Extra Large Devices)
 * 例如：大尺寸桌面显示器
 * 屏幕宽度 >= 1200px 时应用
 * ------------------------------------------------------------------- */
@media (min-width: 1200px) {
    .container {
    }
}