


        main{
            overflow: hidden;
        }
        main .lines{
            z-index: -1;
        }
        main .ttl{
            font-weight: bold;
            text-align: center;
        }
        main .ttl .cn{
            font-size: 2.6vw;
            margin-bottom: 1vw;
        }
        main .ttl .eng{
            font-size: 1.41875vw;
        }
        main .videowapper{
            width: 100%;
            /* height: 30vh; */
            margin: auto;
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
            
        }
        .wap{
            display: flex;
            justify-content: center;
        }
        main .videowapper .ww{
            width: 80%;
            display: flex;
            justify-content: space-between;

            flex-wrap: wrap;
        }
        main .videowapper .ww .title{
            font-weight: bold;
    font-size: 1.5vw;
    margin-top: 1.8vw;
    text-align: center;
        }
      main .videowapper .ready{
        margin-top: 2vw;
        padding-top: 5.7vw;
    padding-bottom: 4.4vw;
        background: #f0f0e6;
        width: 100%;
      }

        main .heading{
            width: 75%;
            margin: 0 auto;
            padding-top: 100px;
            padding-bottom: 170px;
            justify-content: space-between;
        }
        main .heading .ttl{
            padding-left: 60px;
            letter-spacing: 5px;
            text-align: left;
        }
        main .heading>p{
            width: 50%;
            line-height: 2.25;
            font-size: 22px;
            padding-left: 65px;
            letter-spacing: 1px;
        }
        main .heading .ttl{
            text-align: left;
        }
        main .heading .ttl .cn{
            font-size: 77px;
            margin-bottom: 25px;
        }
        main .heading .ttl .eng{
            font-size: 36px;
        }

        main .intro .banner{
            height: 31.25vw;
        }
        main .intro .info{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        main .intro .info,
        main .machining .palace,
        main .vision .content,
        main .cooperate .swiper{
            width:80%;
            position: relative;
            margin: 0 auto;
        }
        main .intro .info>*{
            /* padding: 4.1vw 4.6875vw; */
            opacity: 0;
            transition: transform .5s,opacity .5s;
        }
        main .intro .info>.en{
            transform: translateX(50px);
        }
        main .intro .info>.cn{
            transform: translateX(-50px);
            margin-top: 60px;
            text-align: center;
        }
        main .intro .info>*.frozen{
            transform: translateX(0px);
            opacity: 1;
        }
        main .intro .info>.en{
            width: 65%;
            /* margin-left: 35%; */
            /* background: #f9faf5; */
            font-size: .88vw;
            line-height: 1.6;
            text-align: justify;
        }
        main .intro .info>.en p:first-child{
            margin-bottom: 2.1vw;
            font-size: 22px;
            /* font-weight: bold; */
        }
        main .intro .info>.en p:nth-child(2){
            margin-bottom: 2.1vw;
            font-size: 22px;
            /* font-weight: bold; */
        }
        main .intro .info>.en p:nth-child(3){
            margin-bottom: 2.1vw;
            font-size: 22px;
            /* font-weight: bold; */
        }
        main .intro .info>.cn{
            height: 100%;
            /* position: absolute; */
            width: 45%;
            left: 0px;
            bottom: 0px;
            /* background: #373737; */
            color: black;
        }
        main .intro .info>.cn .ttl{
            position: relative;
            margin-bottom: 4.1vw;
            text-align: left;
        }
        main .intro .info>.cn .ttl p{
       text-align: center;
        }
        main .intro .info>.cn .ttl::after{
            content: '';
            width: 8.3vw;
            height: 1px;
            left: 0px;
            background: #fff;
            position: absolute;
            bottom: -10px;
        }
        main .intro .info .txt{
            font-size: 1.1vw;
         
        }
        main .intro .info .txt p:first-child{
            font-weight: bold;
            font-size: 1.5625vw;
            margin-bottom: 2vw;
        }

        main .machining .ttl{
            background: #f0f0e6;
            padding-top: 5.7vw;
            padding-bottom: 4.4vw;
            margin-bottom: 3.6vw;
            margin-top: 2vw;
        }
        main .machining .palace .list{
            flex-wrap: wrap;
            margin-left: -4.4vw;
        }
        main .machining .palace .list .item{
            width: calc(100% / 3 - 4.4vw);
            margin-left: 4.4vw;
            opacity: 0;
            transform: translateY(30px);
            transition: transform .4s,opacity .4s;
            margin-bottom: 2.1875vw;
        }
        main .machining .palace .list .item.frozen{
            transform: translateY(0px);
            opacity: 1;
        }
        main .machining .palace .list .item .pic{
            position: relative;
            padding-bottom: 100%;
            overflow: hidden;
        }
        main .machining .palace .list .item .pic img{
            transition: .5s transform;
        }
        main .machining .palace .list .item:hover .pic img{
            transform: scale(1.1);
        }
        main .machining .palace .list .item .name{
            font-weight: bold;
            font-size: 1.5vw;
            margin-top: 1.8vw;
            text-align: center;
        }

        main .vision{
            background: #f0f0e6;
            padding: 7.8125vw 0px;
        }
        main .vision .content{
            position: relative;
            z-index: 2;
            
        }
        main .vision .content .bd{
            pointer-events: none;
            z-index: 3;
            border: 2px solid #dedede;
        }
        main .vision .content::after{
            content: '';
            z-index: -1;
            background: #fff;
            padding: 2.6vw;
            top: -2.6vw;
            left: -2.6vw;
        }
        main .vision .content .ttl{
            padding: 4.1vw 0px;
        }
        main .vision .content .list{
            flex-wrap: wrap;
        }
        main .vision .content .list .item{
            width: 50%;
            border-top: 1px solid #dcdcdc;
            border-right: 1px solid #dcdcdc;
            position: relative;
            font-size: 22px;
            color: #666;
            overflow: hidden;
            transition: color .5s .25s;
        }
        main .vision .content .list .item:nth-child(2n){
            border-right-width: 0px;
        }
        main .vision .content .list .item .name{
            font-size: 27px;
            color: #000;
            margin-bottom: 15px;
            position: relative;
            transition: color .5s .25s;
        }
        main .vision .content .list .item .name::after{
            content: '';
            position: absolute;
            bottom: -4px;
            width: 40px;
            opacity: 0;
            transform: translateX(-50%);
            transition: all .5s;
            height: 1px;
            background: #fff;
            left: 0px;
        }
        main .vision .content .list .item.active .name::after{
            opacity: 1;
            transform: translateX(0px);
            transition-delay: .25s;
        }
        main .vision .content .list .item .txt{
            position: relative;
            z-index: 2;
            padding: 3.75vw;
            height: 100%;
        }
        main .vision .content .list .item .pic{
            z-index: 1;
        }
        main .vision .content .list .item .pic::before{
            content: '';
            background: #000;
            opacity: .1;
            z-index: 2;
        }
        main .vision .content .list .item .txt::before,
        main .vision .content .list .item .txt::after{
            content: '';
            position: absolute;
            z-index: -1;
            height: 50%;
            width: 100%;
            background: #fff;
            left: 0px;
            top: 0px;
            transition: transform .5s;
        }
        main .vision .content .list .item .txt::after{
            top: 50%;
        }
        main .vision .content .list .item.active .txt::before{
            transform: translateY(-100%);
        }
        main .vision .content .list .item.active .txt::after{
            transform: translateY(100%);
        }
        main .vision .content .list .item.active,
        main .vision .content .list .item.active .name{
            color: #fff;
        }

        main .cooperate{
            padding-top: 6.25vw;
            padding-bottom: 3.75vw;
        }
        main .cooperate .ttl{
            margin-bottom: 1.4vw;
        }
        main .cooperate .swiper .swiper-slide{
            padding: 0px 1.5625vw;
            text-align: center;
        }
        main .cooperate .swiper .swiper-slide img{
            display: inline-block;
            width: auto;
            max-width: 100%;
            vertical-align: top;
        }
        

        @media(max-width:1600px){
            main .heading{
                padding-top: 80px;
                padding-bottom: 140px;
            }
            main .heading .ttl{
                padding-left: 30px;
            }
            main .heading .ttl .cn{
                font-size: 60px;
            }
            main .heading .ttl .eng{
                font-size: 30px;
            }
            main .heading>p{
                font-size: 20px;
            }
        }

        @media(max-width:1200px){
            main .heading{
                padding-top: 6.6vw;
                padding-bottom: 11.6vw;
            }
            main .heading .ttl .cn{
                font-size: 50px;
                margin-bottom: 20px;
            }
            main .heading .ttl .eng{
                font-size: 24px;
            }
            main .heading>p{
                padding-left: 25px;
            }

            main .vision .content .list .item{
                font-size: 18px;
            }
            main .vision .content .list .item .name{
                font-size: 22px;
            }
            main .vision .content .list .item .name::after{
                width: 30px;
            }
        }

        @media(max-width:1024px){
            main .heading .ttl{
                padding-left: 0px;
            }
            main .heading .ttl .cn{
                font-size: 42px;
                margin-bottom: 15px;
            }
            main .heading .ttl .eng{
                font-size: 20px;
            }
            main .heading>p{
                font-size: 18px;
            }

            main .vision .content .list .item{
                font-size: 16px;
            }
            main .vision .content .list .item .name{
                font-size: 20px;
                margin-bottom: 20px;
            }
            main .vision .content .list .item .name::after{
                width: 20px;
                bottom: -8px;
            }
        }

        @media(max-width:767px){
            main .videowapper iframe{
                width: 40vh !important;
                height: 28vh !important;
            }
            .wap{
                display: flex;
                justify-content: center;
                align-items: center;
            }
            main .videowapper .ww .title {
                font-size: 3.5vw;
            }
            main .ww{
                justify-content: center !important  ;
                width: 100%;
            }
            main .info .en :nth-child(1){
                /* line-height: 5em !important; */
                font-size: 16px !important;
               }

            main .info .en :nth-child(2){
             /* line-height: 5em !important; */
             font-size: 16px !important;
            }
            main .info .en :nth-child(3){
                /* line-height: 5em !important; */
                font-size: 16px !important;
               }
            main .ttl .cn{
                font-size: 20px;
                margin-bottom: 10px;
            }
            main .ttl .eng{
                font-size: 18px;
            }

            main .heading{
                width: 100%;
                padding: 0px 25px;
                padding-top: 40px;
                padding-bottom: 50px;
                display: block;
            }
            main .heading>p{
                width: 100%;
                font-size: 14px;
                margin-top: 25px;
            }
            main .heading .ttl .cn{
                font-size: 30px;
                margin-bottom: 10px;
            }
            main .heading .ttl .eng{
                font-size: 16px;
            }

            main .intro .banner{
                height: 60vw;
            }
            main .intro .info,
            main .machining .palace,
            main .vision .content,
            main .cooperate .swiper{
                width: 100%;
            }
            main .intro .info>*{
                width: 100% !important;
                padding: 30px 35px;
                margin-left: 0px !important;
            }
            .machining{
                width: 100% !important;
            }
            main .intro .info>.cn{
                position: relative;
            }
            main .intro .info>.cn .ttl{
                margin-bottom: 25px;
            }
            main .intro .info .txt p:first-child,
            main .intro .info>.en p:first-child{
                font-size: 16px;
            }

            main .machining .palace .list{
                display: block;
                padding: 0px 35px;
                margin-left: 0px;
            }
            main .machining .palace .list .item{
                width: 100%;
                margin-left: 0px;
                margin-bottom: 25px;
            }
            main .machining .palace .list .item .name{
                font-size: 4vw;
                margin-top: 15px;
            }

            main .vision .content{
                width: calc(100% - 70px);
            }
            main .vision .content .ttl{
                padding: 5.3vw 4.1vw;
            }
            main .vision .content .list .item{
                width: 100%;
            }
            main .vision .content .list .item{
                font-size: 14px;
            }
            main .vision .content .list .item .name{
                font-size: 18px;
                margin-bottom: 15px;
            }
            main .vision .content .list .item .name::after{
                bottom: -6px;
            }

            main .cooperate{
                padding-top: 8vw;
                padding-bottom: 5vw;
            }
            main .cooperate .ttl{
                margin-bottom: 5.5vw;
            }
        }