body{
    margin:0 0 ;
    letter-spacing: 2px;
    font-family: 'Microsoft YaHei','Arial', sans-serif;
}
@media (min-width: 770px){
    .mobile{
        display: none;
    }
    .top{
        width:1200px;
        margin:0 auto;
        height:60px;
        padding: 15px 0;
        clear: both;
    }

    .logo img{
        width: 200px;
        height: auto;
        
    }
    .logo{
        width: 200px;
        height: auto;
        margin-right:50px;
        float:left;
    }
    .nav{
        
        float:left;
    }

    .nav ul {
        width:800px;
        display: block;
    }
        
    .nav ul li{
        margin: 0 35px;
        display: inline-block;
        font-size: 19px;
        color:#262626;
    }

    .nav ul li a:hover{
        color:#ff3000;
    }

    .default-color {
        color: #262626; /* 默认颜色 */
        text-decoration: none;
    }
    .active-color {
        color: #ff3000; /* 激活颜色 */
        font-weight: bold;
        text-decoration: none;
    }

    .banner{
        background: url("./pic/banner.jpg") no-repeat center center;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
        background-size: cover;
        position: relative;
        width:100%;
        height:500px;
    }
    .biaoti{
        width:1200px;
        margin:0 auto;
    }
    .title2{
        font-size: 60px;
        text-align: center;
        color:#ffe5df;
        margin-top:80px;
    }
    .title1{
        font-size: 60px;
        text-align: center;
        margin-top:-150px;
        margin-bottom: 80px;
    }
    .title3{
        color:#ff3000;
        text-align: center;
        margin-top:-40px;
    }
    .sp1{
        text-align: center;
        color:#f00001;
    }
    .sp2{
        text-align: center;
        color:#ff3000;
    }


    .outer{
        width:1200px;
        margin:0 auto;
        height:1230px;
    }
    .title4{
        font-size: 65px;
        text-align: center;
        color:#262626;
        text-decoration: underline;
        text-decoration-thickness: 10px;
        text-decoration-color: #ffe5df;
        margin:15px 0;
    }
    .title5{
        text-align: center;
        font-size: 25px;
        line-height: 40px;
        color:#535353;
        margin:25px 0;
    }

    .cont{
        margin-top:90px;
        width: 100%;
        height:auto;
    }
    .cont1-left{
        width:49%;
        height:210px;
        background-color: #ffe5df;
        float: left;
    }
    .cont1-left-1{
        height:33%;
        width:30%;
        background-image:linear-gradient(to bottom,#ff3f3f,#ff0101) ;
        font-size: 30px;
        font-weight: bold;
        color:white;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -35px;
    }
    .cont1-left p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont1-right{
        width:49%;
        height:210px;
        margin-left:2%;
        background-color: #ffe5df;
        float: left;
    }
    .cont1-right-1{
        height:33%;
        width:30%;
        background-image:linear-gradient(to bottom,#ff3f3f,#ff0101) ;
        font-size: 30px;
        font-weight: bold;
        color:white;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -35px;
    }
    .cont1-right p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont2-left{
        width:49%;
        height:210px;
        background-color: #ffeeea;
        margin-top: 60px;
        float: left;
    }
    .cont2-left-1{
        height:33%;
        width:30%;
        background-image:linear-gradient(to bottom,#ff6e2f,#ff2c00) ;
        font-size: 30px;
        font-weight: bold;
        color:white;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -35px;
    }
    .cont2-left p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont2-right{
        width:49%;
        height:210px;
        margin-left:2%;
        background-color: #ffeeea;
        margin-top: 60px;
        float: left;
    }
    .cont2-right-1{
        height:33%;
        width:30%;
        background-image:linear-gradient(to bottom,#ff6e2f,#ff2c00) ;
        font-size: 30px;
        font-weight: bold;
        color:white;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -35px;
    }
    .cont2-right p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont3-left{
        width:49%;
        height:210px;
        background-color: #fff2e7;
        margin-top: 60px;
        float: left;
    }
    .cont3-left-1{
        height:33%;
        width:30%;
        background-image:linear-gradient(to bottom,#ffad37,#fe6501) ;
        font-size: 30px;
        font-weight: bold;
        color:white;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -35px;
    }
    .cont3-left p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont3-right{
        width:49%;
        height:210px;
        margin-left:2%;
        background-color: #fff2e7;
        margin-top: 60px;
        float: left;
    }
    .cont3-right-1{
        height:33%;
        width:30%;
        background-image:linear-gradient(to bottom,#ffad37,#fe6501) ;
        font-size: 30px;
        font-weight: bold;
        color:white;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -35px;
    }
    .cont3-right p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont4-left{
        width:49%;
        height:210px;
        background-color: #ffe5df;
        margin-top: 60px;
        float: left;
    }
    .cont4-right{
        width:49%;
        height:210px;
        margin-left:2%;
        background-color: #ffe5df;
        margin-top: 60px;
        float: left;
    }
    .cont4-left p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }
    .cont4-right p{
        margin:7% 7% 0;
        font-size: 25px;
        line-height: 40px;
        text-align: justify;
        color:#262626
    }

    .yuanjing{
        width:1200px;
        margin:0 auto;
        height:490px;
    }
    .yuancont{
        height: 300px;
    }
    .yuancont-pic1{
        width:24%;
        height: 230px;
        margin-top: 14px;
        float: left;
        overflow: hidden;
    }
    .yuancont-pic1 img{
        width:100%;
        transition: transform 0.3s ease;
    }
    .yuancont-pic1:hover img{
        transform: scale(1.2);
    }
    .yuancont-pic2{
        width:24%;
        height: 230px;
        margin-left: 1.33%;
        margin-top: 14px;
        float: left;
        overflow: hidden;
    }
    .yuancont-pic2 img{
        width:100%;
        transition: transform 0.3s ease;
    }
    .yuancont-pic2:hover img{
        transform: scale(1.2);
    }


    .footer{
        width: 100%;
        height:60px;
        background-image:linear-gradient(to bottom,#ff6d2f,#ff2d01) ;
    }
    .footinner{
        width:1200px;
        height:inherit;
        margin:0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .footinner p{
        width: 100%;
        color:white;
        text-align: center;
        margin:0;
    }


    .totop{        
        position: fixed;       
        right: 40px;
        bottom: 40px;
        display: none;
    }
    .totop a{  
        width:40px;
        height:40px;
        margin-top:3px;
        border-radius: 50%;
        background-color: #ffd0c5;
        box-shadow: 0 5px 10px #ffd0c5;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .totop a img{
        width: 80%;
    }
    .totop a:hover{  
        background-color: #ff3000;
        box-shadow: 0 5px 10px #ffd0c5;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .totop a:hover img{
        width: 80%;
    }
}


@media (max-width: 769px){
    .pc{
        display: none;
    }
    .mobile{
        margin:0 auto;
        width: 100%;
    }
    .mbanner{
        width: 100%;
        height:auto;
        overflow: hidden;
    }
    .mbanner img{
        width: 100%;
        height: auto;

    }

    .mbiaoti{
        width:95%;
        margin:0 auto;
    }
    .mtitle2{
        font-size: 56px;
        text-align: center;
        color:#ffe5df;
        margin-top:70px;
    }
    .mtitle1{
        font-size: 65px;
        text-align: center;
        font-weight: bolder;
        margin-top:-150px;
        margin-bottom: 80px;
    }
    .mtitle3{
        font-size: 40px;
        color:#ff3000;
        text-align: center;
        margin-top:-65px;
    }
    .msp1{
        text-align: center;
        color:#f00001;
    }
    .msp2{
        text-align: center;
        color:#ff3000;
    }


    .mouter{
        width:92%;
        margin:0 auto;
        margin-bottom:30px;
    }
    .mouter::after{
        content: "";
        display: table;
        clear: both;
    }
    .mtitle4{
        font-size: 50px;
        text-align: center;
        color:#262626;
        line-height: 75px;
        text-decoration: underline;
        text-decoration-color: #ffe5df;
        text-decoration-thickness: 10px;
        margin:-25px 0 15px;
    }
    .mtri{
        width:100%;
        display: flex;
        justify-content: center;
        margin:2.5% auto;
    }
    .mtriangle{
        width:0;
        height:0px;
        border-top: 25px solid #262626;
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
    }

    .mcont-top{
        width:30%;
        height:77px;
        margin:0 auto;
        border-radius: 30px;
        color: white;
        font-size: 30px;
        font-weight:bold;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index: 1;
    }
    .mcont-bottom{
        width:100%;
        border-radius: 30px;
        margin-top:-65px;
        
    }
    .mcont-bottom p{
        text-align: justify;
        font-size: 28px;
        color: #262626;
        line-height: 43px;
        padding:50px 25px 25px;
    }
    .mcont1{
        width:100%;
        margin-top:25px;
    }
    .mcont2{
        width:100%;
        margin-top:-3px;
    }
    .mcont1-top{       
        background: linear-gradient(to bottom,#ff3f3f,#ff0101);
    }
    .mcont1-bottom{        
        background-color: #ffeaec;
    }
    .mcont2-top{       
        background: linear-gradient(to bottom,#ff6e2f,#ff2d00);
    }
    .mcont2-bottom{        
        background-color: #ffeeea;
    }
    .mcont3-top{       
        background: linear-gradient(to bottom,#ffac37,#fe6400);
    }
    .mcont3-bottom{        
        background-color: #fff3e7;
    }



    .myuanout{
        width:92%;
        margin:0 auto;
        margin-bottom:38px;
    }
    .myuanout::after{
        content: "";
        display: table;
        clear: both;
    }
    .msubtitle{
        width:100%;
        height:60px;
        border-radius: 60px;
        background-image:linear-gradient(to right,#ffdddd,#ffe5dd) ;
        margin:25px auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .msubtitle p{
        background-image:linear-gradient(to right,#f00001,#ff3000) ;
        -webkit-background-clip: text;
        color: transparent;
        font-size: 32px;
        font-weight: bold;
    }

    .mcont-mid-1{
        margin-top:15px;
        background: url("./picphone/part9-pic-1.jpg" ) no-repeat center center;
    }
    .mcont-mid-2{
        margin-left:3%;
        margin-top:15px;
        background: url("./picphone/part9-pic-2.jpg" ) no-repeat center center;
    }
    .mcont-mid-3{
        margin-top:20px;
        background: url("./picphone/part9-pic-3.jpg" ) no-repeat center center;
        
    }
    .mcont-mid-4{
        margin-left:3%;
        margin-top:20px;
        background: url("./picphone/part9-pic-4.jpg" ) no-repeat center center;
    }
    .mcont-mid{
        width:48.5%;
        border-radius: 30px;
        background-size: 100% 100%;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
        float: left;
    }
    .mcont-mid::after
    {
        content:"";
        display:block;
        padding:40%;
    }


    .mfooter{
        width:92%;
        height:20px;
        margin:0 auto;
        margin-bottom:220px;
    }
    .mfootinner{
        width:100%;
    }
    .mfootinner p{
        color:#262626;
        font-size: 18px;
        text-align: center;
    }


    .mnav{
        position: fixed;
        z-index: 1;
        height:150px;
        width: 100%;
        background-color: rgba(255, 255, 255, 0.98);
        box-shadow: 0 -3px 3px rgba(97, 97, 97,0.05);
        bottom: 0;
    }
    .mnav-inner{
        width:92%;
        margin:0 auto;
    }
    .mnavcont1{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont1-element{
        background: url("./picphone/icon1a.png") no-repeat center center;
        background-size:100%;
        width: 30%;
        height:50px;
        margin-left:35%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont1 p{
        color: #262626;
        font-size: 22px;
        text-align: center;
        margin-top:0px;
    }

    .mnavcont2{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont2-element{
        background: url("./picphone/icon2a.png") no-repeat center center;
        background-size:100%;
        width: 30%;
        height:50px;
        margin-left:35%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont2 p{
        color: #262626;
        font-size: 22px;
        text-align: center;
        margin-top:0px;
    }
    
    .mnavcont3{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont3-element{
        background: url("./picphone/icon3a.png") no-repeat center center;
        background-size:100%;
        width: 30%;
        height:50px;
        margin-left:35%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont3 p{
        color: #262626;
        font-size: 22px;
        text-align: center;
        margin-top:0px;
    }

    .mnavcont4{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont4-element{
        background: url("./picphone/icon4b.png") no-repeat center center;
        background-size:100%;
        width: 30%;
        height:50px;
        margin-left:35%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont4 p{
        color: #ff2c00;
        font-size: 22px;
        font-weight: bold;
        text-align: center;
        margin-top:0px;
    }

    .mnavcont5{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont5-element{
        background: url("./picphone/icon5a.png") no-repeat center center;
        background-size:100%;
        width: 30%;
        height:50px;
        margin-left:35%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont5 p{
        color: #262626;
        font-size: 22px;
        text-align: center;
        margin-top:0px;
    }

}




@media (max-width: 667px){
    .pc{
        display: none;
    }
    .mobile{
        margin:0 auto;
        width: 100%;
    }
    .mbanner{
        width: 100%;
        height:auto;
        overflow: hidden;
    }
    .mbanner img{
        width: 100%;
        height: auto;

    }

    .mbiaoti{
        width:95%;
        margin:0 auto;
    }
    .mtitle2{
        font-size: 33px;
        text-align: center;
        color:#ffe5df;
        margin-top:30px;
    }
    .mtitle1{
        font-size: 33px;
        text-align: center;
        font-weight: bolder;
        margin-top:-85px;
        margin-bottom: 75px;
    }
    .mtitle3{
        font-size: 25px;
        color:#ff3000;
        text-align: center;
        margin-top:-65px;
    }
    .msp1{
        text-align: center;
        color:#f00001;
    }
    .msp2{
        text-align: center;
        color:#ff3000;
    }


    .mouter{
        width:92%;
        margin:0 auto;
        margin-bottom:20px;
    }
    .mouter::after{
        content: "";
        display: table;
        clear: both;
    }
    .mtitle4{
        font-size: 27px;
        text-align: center;
        color:#262626;
        line-height: 40px;
        text-decoration: underline;
        text-decoration-color: #ffe5df;
        text-decoration-thickness: 6px;
        margin:-20px 0 12px;
    }
    .mtri{
        width:100%;
        display: flex;
        justify-content: center;
        margin:2.5% auto;
    }
    .mtriangle{
        width:0;
        height:0px;
        border-top: 13px solid #262626;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
    }

    .mcont-top{
        width:30%;
        height:40px;
        margin:0 auto;
        border-radius: 20px;
        color: white;
        font-size: 17px;
        font-weight:bold;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index: 1;
    }
    .mcont-bottom{
        width:100%;
        border-radius: 20px;
        margin-top:-36px;
        
    }
    .mcont-bottom p{
        text-align: justify;
        font-size: 15px;
        color: #262626;
        line-height: 23px;
        padding:30px 15px 15px;
    }
    .mcont1{
        width:100%;
        margin-top:15px;
    }
    .mcont2{
        width:100%;
        margin-top:-3px;
    }
    .mcont1-top{       
        background: linear-gradient(to bottom,#ff3f3f,#ff0101);
    }
    .mcont1-bottom{        
        background-color: #ffeaec;
    }
    .mcont2-top{       
        background: linear-gradient(to bottom,#ff6e2f,#ff2d00);
    }
    .mcont2-bottom{        
        background-color: #ffeeea;
    }
    .mcont3-top{       
        background: linear-gradient(to bottom,#ffac37,#fe6400);
    }
    .mcont3-bottom{        
        background-color: #fff3e7;
    }



    .myuanout{
        width:92%;
        margin:0 auto;
        margin-bottom:20px;
    }
    .myuanout::after{
        content: "";
        display: table;
        clear: both;
    }
    .msubtitle{
        width:100%;
        height:35px;
        border-radius: 60px;
        background-image:linear-gradient(to right,#ffdddd,#ffe5dd) ;
        margin:15px auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .msubtitle p{
        background-image:linear-gradient(to right,#f00001,#ff3000) ;
        -webkit-background-clip: text;
        color: transparent;
        font-size: 15px;
        font-weight: bold;
    }

    .mcont-mid-1{
        margin-top:5px;
        background: url("./picphone/part9-pic-1.jpg" ) no-repeat center center;
    }
    .mcont-mid-2{
        margin-left:3%;
        margin-top:5px;
        background: url("./picphone/part9-pic-2.jpg" ) no-repeat center center;
    }
    .mcont-mid-3{
        margin-top:10px;
        background: url("./picphone/part9-pic-3.jpg" ) no-repeat center center;
        
    }
    .mcont-mid-4{
        margin-left:3%;
        margin-top:10px;
        background: url("./picphone/part9-pic-4.jpg" ) no-repeat center center;
    }
    .mcont-mid{
        width:48.5%;
        border-radius: 20px;
        background-size: 100% 100%;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
        float: left;
    }
    .mcont-mid::after
    {
        content:"";
        display:block;
        padding:40%;
    }


    .mfooter{
        width:92%;
        height:20px;
        margin:0 auto;
        margin-bottom:130px;
    }
    .mfootinner{
        width:100%;
    }
    .mfootinner p{
        color:#262626;
        font-size: 13px;
        text-align: center;
    }



    .mnav{
        position: fixed;
        z-index: 1;
        height:80px;
        width: 100%;
        background-color: rgba(255, 255, 255, 0.98);
        box-shadow: 0 -3px 3px rgba(97, 97, 97,0.05);
        bottom: 0;
    }
    .mnav-inner{
        width:92%;
        margin:0 auto;
    }
    .mnavcont1{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont1-element{
        background: url("./picphone/icon1a.png") no-repeat center center;
        background-size:100%;
        width: 40%;
        height:30px;
        margin-left:30%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont1 p{
        color: #262626;
        font-size: 12px;
        text-align: center;
        margin-top:0px;
    }

    .mnavcont2{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont2-element{
        background: url("./picphone/icon2a.png") no-repeat center center;
        background-size:100%;
        width: 40%;
        height:30px;
        margin-left:30%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont2 p{
        color: #262626;
        font-size: 12px;
        text-align: center;
        margin-top:0px;
    }
    
    .mnavcont3{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont3-element{
        background: url("./picphone/icon3a.png") no-repeat center center;
        background-size:100%;
        width: 40%;
        height:30px;
        margin-left:30%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont3 p{
        color: #262626;
        font-size: 12px;
        text-align: center;
        margin-top:0px;
    }

    .mnavcont4{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont4-element{
        background: url("./picphone/icon4b.png") no-repeat center center;
        background-size:100%;
        width: 40%;
        height:30px;
        margin-left:30%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont4 p{
        color: #ff2c00;
        font-size: 12px;
        text-align: center;
        font-weight: bold;
        margin-top:0px;
    }

    .mnavcont5{
        width:20%;
        text-decoration: none;
        float: left;
    }
    .mnavcont5-element{
        background: url("./picphone/icon5a.png") no-repeat center center;
        background-size:100%;
        width: 40%;
        height:30px;
        margin-left:30%;
        margin-top: 10px;
        image-rendering: crisp-edges;
        image-rendering: pixelated; 
    }
    .mnavcont5 p{
        color: #262626;
        font-size: 12px;
        text-align: center;
        margin-top:0px;
    }

}


img { 
    image-rendering: crisp-edges;
    image-rendering: pixelated; 
  }