body {
}

       
        .contact{
            padding-top:150px;
            padding-bottom:30px;
        }
        .contactMap{
            height:400px;
            position:relative;
            border:1px solid #CCCCCC;
        }
        .contactMap__message{
            width:400px;
            height:400px;
            background-color:rgba(0,0,0,0.4);
            position:absolute;
            top:0;
            left:165px;
        }
       .contactMap__messageFram {
           padding:0 30px;
           box-sizing:border-box;
        }
       .messageFram__title{
           height:40px;
           line-height:40px;
           color:white;
           font-size:18px;
           margin-top:30px;
       }
       .messageFram__list{
           display: -webkit-box;
           display: box;
           display: -webkit-flex;
           display: flex;
           margin-top:10px;
       }
       .messageFram__listSame{
           -webkit-flex:1;
            flex: 1;
            
            height: 36px;
       }
        .messageFram__name {
            
        }

        .messageFram__inner {
            height: 36px;
            width: 100%;
            padding-left: 10px;
            box-sizing: border-box;
            color:#ccc;
            background-color:transparent;
            border:1px solid #CCCCCC;
            outline:none;
        }
        .messageFram__inner:focus{
            border-color:#fff;
            color:#fff;
        }
        .messageFram__tel {
            margin-left:20px;
        }

        .messageFram__telInner {
            height: 36px;
            width: 100%;
            padding-left: 10px;
            box-sizing: border-box;
           
        }

        .messageFram__comment {
            height: 115px;
            margin-top: 10px;
        }

        .messageFram__commentInner {
            height: 115px;
            width: 100%;
            padding: 10px 0 0 10px;
            box-sizing: border-box;
            color:#ccc;
            line-height:32px;
        }

        .messageFram__submit {
            height: 40px;
            width: 132px;
            background-color: transparent;
            text-align: center;
            line-height: 40px;
            color: #fff;
            font-weight: bold;
            margin-top: 15px;
            filter:chroma(color=#000000);
            cursor:pointer;
            border:1px solid #fff;
        }
.contactUS{
            margin-top:100px;

        }
        .contactUS__header{
            height:140px;
            width:230px;
            margin:0 auto; 
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            padding:45px 0;
            box-sizing:border-box;
            color:#414141;
            
        }
        .contactUS__headerLeft{
            -webkit-flex:1;
            flex: 1;
            font-size:55px;
            text-align:right;
            line-height:50px;
        }
        .contactUS__headerRight{
            -webkit-flex:5;
            flex: 5;
            line-height:20px;
            padding-top:5px;
            box-sizing:border-box;
        }
        .contactUS__headerRight span{
            font-size:30px;
        }
        .contactUS__method{
            margin-top:30px;
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
        }
        .contactUS__methodList{
            height:260px;
            -webkit-flex:1;
            flex: 1;
            margin-left:20px;
            padding:110px 30px 0 30px;
            box-sizing:border-box;
            text-align:center;
            font-size:14px;
            color:#333333;
            background-size:15% auto;
            background-position:center 15%;
        }
        .contactUS__methodList span{
            font-size:18px;
        }
        .contactUS__methodList:first-child{
            margin-left:0;
        }
        .contactUS__methodAddress{
            background-color:#F9E0E0;
            background-image: url(/Images/icon/address.fw.png);
           
        }
        .contactUS__methodTel{
            background-color:#DDF2F4;
            background-image: url(/Images/icon/phone.fw.png);
        }
        .contactUS__methodEmail{
            
            background-color:#EBF3DA;
            background-image: url(/Images/icon/email.fw.png);
        }
        .contactUS__methodQQ{
            background-color:#D5ECF9;
            background-image: url(/Images/icon/QQ.fw.png);
        }
        .contactHow{
            margin-top:100px;
            background-color:#F7F7F7;
        }
        .contactHow__header{
            height:140px;
            width:230px;
            margin:0 auto; 
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            padding:45px 0;
            box-sizing:border-box;
            color:#414141;
            
        }
        .contactHow__headerLeft{
            -webkit-flex:1;
            flex: 1;
            font-size:55px;
            text-align:right;
            line-height:50px;
        }
        .contactHow__headerRight{
            -webkit-flex:5;
            flex: 5;
            line-height:20px;
            padding-top:5px;
            box-sizing:border-box;
        }
        .contactHow__headerRight span{
            font-size:30px;
        }
        .contactHow__way{
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
        }
        .contactHow__wayList{
            -webkit-flex:1;
            flex: 1;
            margin-left:110px;
            font-size:17px;
            padding:30px 60px;
            box-sizing:border-box;
            background-size:9% auto;
            background-position:5% 15%;
        }
        .contactHow__wayList:first-child{
            margin-left:0;
        }
        .contactHow__wayBus{
            color:#31A0E2;
            background-image: url(/Images/icon/bus.fw.png);
        }

        .contactHow__wayAddress{
            color:#DE6764;
            background-image: url(/Images/icon/taxi.fw.png);
        }
        .contactHow__wayList span{
            font-size:15px;
            line-height:25px;
            color:#333333;
        }




        .companyAbout{
            padding-top:120px;
        }
         .companyAbout__introduction {
            height: 700px;
        }

        .companyAbout__introductionPic {
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            padding:50px;
            opacity:0;
        }
        .companyAbout__introductionPic--current{
            opacity:1;
            transition: all 1s ease;
             padding:0;
        }
        .introductionPic__inner {
            height: 400px;
            -webkit-flex: 1;
            flex: 1;
        }
        .introductionPic__inner img {
            max-width:100%;
        }
        .companyAbout__introductionText {
            margin-top: 30px;
            font-size: 16px;
            line-height: 30px;
            color: #363636;
        }

            .companyAbout__introductionText p span {
                color: #039DE5;
            }

        .companyAbout__special {
            margin-top: 20px;
            opacity:0;
        }
        .companyAbout__special--current{
            opacity:1;
            transition: all 2s ease;
        }
        .companyAbout__specialPic {
            height: 380px;
            
        }

        .companyAbout__specialText {
            margin-top: 20px;
        }

        .specialText__innerTitle {
            width: 200px;
            height: 55px;
            margin: 0 auto;
            border-bottom: 2px solid #039DE5;
            line-height: 55px;
            color: #039DE5;
            text-align: center;
            font-size: 27px;
        }

        .specialText__innerOur {
            margin-top: 50px;
            width: 150px;
        }

        .specialText__innerWord {
            text-align: center;
            margin-top: 10px;
            font-size: 17px;
            color: #5D5D5D;
        }

            .specialText__innerWord span {
                color: #353434;
                font-size: 20px;
                font-weight: bold;
                line-height: 40px;
            }

            .specialText__innerWord p {
                line-height: 30px;
            }
             .companyAbout__development{
            width:100%;
            height:600px;
            background-color:#F5F5F5;
            margin-top:60px;
        }
        .companyAbout__developmentComment{
            height:100%;
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            position:relative;
            overflow:hidden;
        }
        .developmentComment__list{
            -webkit-flex: 1;
            flex: 1;
            position:relative;
            overflow:hidden;
        }
        .developmentComment__axisTitle{
            margin-top:40px;
            width:289px;
            font-size:27px;
            color:#545454;
            line-height:30px;
        }
        .developmentComment__axisTitle span{
            color: #039DE5;
            font-weight:bold;
            font-size:33px;
             line-height:32px;
        }
        .developmentComment__axisTitle ins{
            color: #039DE5;
            font-weight:bold;
            font-size:33px;
             line-height:32px;
        }
        .developmentComment__axisTime{
            width:400px;
            margin-top:40px;
            position:relative;
            
        }
        .axisTime__item{
            width:220px;
            height:35px;
            margin-top:20px;

            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            cursor:pointer;

            
        }
        .axisTime__itemIcon{
            width:30px;
            height:30px;
            background-color:#D6D6D6;
            border-radius:15px;
            margin-top:2px;
        }
        .axisTime__itemText{
            -webkit-flex:8;
            flex: 8;
            color:#979797;
            line-height:35px;
            font-size:16px;
            padding-left:15px;
            box-sizing:border-box;
            position:relative;  
            overflow:hidden;
        }
        .axisTime__itemText span{
            width:200px;
            position:absolute;
            left:20px;
            transition:all .4s ease;
            
        }
        .axisTime__itemText em{
            width:200px;
            position:absolute;
            left:200px;
            color:#555555;
            font-size:18px;
            font-weight:bold;
            transition:all .4s ease;
        }
         .axisTime__item--current .axisTime__itemIcon{
            background-color:#4BB4E7;
        }
        .axisTime__item--current .axisTime__itemText{
            color:#555555;
            font-size:18px;
            font-weight:bold;
        }
        .axisTime__item:hover .axisTime__itemText em{
            left:20px;
        }
        .axisTime__item:hover .axisTime__itemText span{
            left:-200px;
        }
        .axisTime__item:hover .axisTime__itemIcon{
            background-color:#4BB4E7;
        }
        .developmentComment__details{
            width:100%;
            height:540px;
            position:relative;
            margin-top:40px;
        }
        .developmentComment__detailsPic08{
            z-index: 22;
        }
        .developmentComment__detailsPic{
            width:100%;
            height:540px;
            position:absolute;
            box-shadow:5px 5px 5px #939393;

        }
        .detailsPic__enter{
            z-index: 22;
        } 
        .developmentComment__bigInner{
            position:relative;
            
        }
        .bigInner__item{
            position:absolute;
            width:2500px;
            height:165px;
            top:200px;
            float:left;
        }
        .bigInner__item li{
            margin-left:80px;
            float:left;
        }
         .companyAbout__concept {
            opacity: 0;
            margin-top:60px;
        }

        .companyAbout__concept--current {
            opacity: 1;
            transition: all 1s ease;
        }
        .companyAbout__conceptText{
            margin-left:0;
            margin-top:40px;
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            transition: all 1.5s ease;
        }
        .companyAbout__concept--current .companyAbout__conceptText{
            margin-left:50px;
        }
        .companyAbout__conceptTitle{
            margin-left:80px;
            font-size:30px;
            transition: all 1.5s ease;
        }
        .companyAbout__concept--current .companyAbout__conceptTitle{
            margin-left:50px;
        }
        
        .companyAbout__conceptTitle span{
            font-size:32px;
            color: #039DE5;
            font-weight:bold;
        }
        .conceptText__left{
            -webkit-flex: 3;
            flex: 3;
        }
        .conceptText__right{
            -webkit-flex: 5;
            flex: 5;
        }
        .conceptText__list span{
            font-size:34px;
        }
        .conceptText__list p{
            margin-top:30px;
            font-size:15px;
        }
         .companyAbout__position {
            margin-top: 100px;
        }

        .companyAbout__positionFrem {
            margin-top: 30px;
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            height: 500px;
        }

        .positionFrem__item {
            -webkit-flex: 1;
            flex: 1;
            margin-left: 25px;
        }

            .positionFrem__item:first-child {
                margin-left: 0;
            }

        .positionFrem__itemTitle {
            height: 45px;
            line-height: 45px;
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
            font-size: 21px;
        }

        .positionFrem__Designer .itemTitle__en {
            -webkit-flex: 1;
            flex: 1;
            border-bottom: 4px solid #88CBEB;
            color: #444444;
        }

        .positionFrem__Designer .itemTitle__ch {
            -webkit-flex: 2;
            flex: 2;
            border-bottom: 4px solid #4BB4E7;
            font-weight: bold;
            font-size: 19px;
        }
        .positionFrem__Plan .itemTitle__en {
            -webkit-flex: 1;
            flex: 1;
            border-bottom: 4px solid #F4D7FF;
            color: #444444;
        }

        .positionFrem__Plan .itemTitle__ch {
            -webkit-flex: 2;
            flex: 2;
            border-bottom: 4px solid #BC3FEA;
            font-weight: bold;
            font-size: 19px;
        }
         .positionFrem__Front .itemTitle__en {
            -webkit-flex: 1.3;
            flex: 1.3;
            border-bottom: 4px solid #BCFC8D;
            color: #444444;
        }

        .positionFrem__Front .itemTitle__ch {
            -webkit-flex: 2;
            flex: 2;
            border-bottom: 4px solid #71D824;
            font-weight: bold;
            font-size: 19px;
        }
       .positionFrem__Programmer .itemTitle__en {
            -webkit-flex: 1;
            flex: 1;
            border-bottom: 4px solid #FFFDC4;
            color: #444444;
        }

        .positionFrem__Programmer .itemTitle__ch {
            -webkit-flex: 2.5;
            flex: 2.5;
            border-bottom: 4px solid #FCE655;
            font-weight: bold;
            font-size: 19px;
        }
        .positionFrem__Account .itemTitle__en {
            -webkit-flex: 1.3;
            flex: 1.3;
            border-bottom: 4px solid #FFABAB;
            color: #444444;
        }

        .positionFrem__Account .itemTitle__ch {
            -webkit-flex: 2;
            flex: 2;
            border-bottom: 4px solid #E72424;
            font-weight: bold;
            font-size: 19px;
        }
        .itemComment__requirement {
            margin-top: 25px;
        }
        .positionFrem__Front .itemComment__requirement{
            margin-top:3.5px;
        }
        .positionFrem__Front .itemComment__requirement:first-child{
            margin-top: 25px;
        }
        .positionFrem__Programmer .itemComment__requirement{
            margin-top:3.5px;
        }
        .positionFrem__Programmer .itemComment__requirement:first-child{
            margin-top: 25px;
        }
        .positionFrem__Account .itemComment__requirement{
            margin-top:21px;
        }
        .positionFrem__Account .itemComment__requirement:first-child{
            margin-top: 25px;
        }
        .itemComment__requirementEn {
            height: 17px;
            color: #8C8C8C;
            line-height: 17px;
            font-size: 10px;
        }

        .itemComment__requirementCh {
            height: 23px;
            line-height: 23px;
            font-size: 14px;
        }

        .positionFrem__itemApply {
            height: 50px;
            margin-top: 30px;
            line-height: 50px;
            text-align: right;
            padding-right: 50px;
            box-sizing: border-box;
            font-size: 18px;
            background-color:#ECECEC;
        }

        .positionFrem__itemApply span {
            position:absolute;
            z-index:5;
            color: black;
            right:20px;
        }
        .positionFrem__item:hover .positionFrem__itemApply span {
            color: white;
        }
        .positionFrem__itemApply span em{
            color: white;
        }
        .positionFrem__itemApply{
            position:relative;
            overflow:hidden;
            
        }
        .itemApply__img{
            position:absolute;
            left:0;
            z-index:5;
        }
        .itemApply__color{
            position:absolute;
            left:-578px;
            height:50px;
            width:578px;  
            transition:all .4s ease;
        }
        .positionFrem__item:hover .itemApply__color{
            left:0;
        }
        .positionFrem__Designer  .itemApply__color{
            background-color:#4BB4E7;
        }
        .positionFrem__Plan  .itemApply__color{
            background-color:#BC3FEA;
        }
        .positionFrem__Front .itemApply__color{
            background-color:#71D824;
        }
        .positionFrem__Programmer .itemApply__color{
            background-color:#FCE655;
        }
        .positionFrem__Account .itemApply__color{
            background-color:#E72424;
        }
       .positionFrem__pic{
           height:450px;
       }
       .companyAbout__family{
            margin-top:100px;
        }
        .companyAbout__familyPic{
            display: -webkit-box;
            display: box;
            display: -webkit-flex;
            display: flex;
        }
        .familyPic__fram{
            -webkit-flex: 1;
            flex: 1;
            height:185px;
            background-color:#EFEFEF;
            margin-top:10px;
            border-radius:100px;
            margin-left:14px;
        }
        .familyPic__fram:hover{
            margin-top:0;
        }
        .companyAbout__familyArt{
            margin-top:50px;
            height:250px;
        }
       .companyAbout__positionFrem .positionFrem__pic {
            opacity: 0;
            transform:rotate(-20deg);
        }

        .companyAbout__positionFrem--current .positionFrem__pic {
            opacity: 1;
            transform:none;
            transition: all 1s ease;
        }
        .companyAbout__positionFrem .positionFrem__item{
            opacity: 0;
            transform:rotate(20deg);
        }

        .companyAbout__positionFrem--current .positionFrem__item {
            opacity: 1;
            transform:none;
            transition: all 1s ease;
        }
         .companyAbout__familyPic {
            opacity: 0;
            margin-left:-100px;
        }

        .companyAbout__familyPic--current{
            opacity: 1;
             margin-left:0;
            transition: all 1s ease;
        }
         .service{
        padding-top:70px;
    }
     .serviceIntro{
            background-color:white;
        }
        .serviceIntro__flash{
            height:370px;
        }
        .serviceIntro__flashRoot{ 
            display:block; 
            position:relative; 
            margin:0 auto; 
        }
        .flashRoot__root{ 
            width:1200px; 
            display:block; 
            position:relative; 
            margin:0 auto; 
        }
        .flashRoot__obj01{ 
            display:block; 
            margin:0 auto; 
        }
        .flashRoot__obj02{
            display:block;
            position:absolute;
            left:280px;
            top:170px; 
            z-index:2;
        }
        .flashRoot__obj03{
            display:block;
            position:absolute;
            left:338px;
            top:50px;
        }
        .serviceIntro__howInner{
            position:absolute;
            width:500px;
            height:200px;
            background-image:url(/Images/Service/pad-5.png);
            background-size:100% auto;
            background-position:center;
            top:-38px;
        }
        .flashRoot__obj05{
            display:block;
            position:absolute;
            left:650px;
            top:220px; 
            z-index:2;
        }
        .serviceIntro__how{
            background-color:#0698EC;
            height:160px;
            position:relative;
        }
        .serviceComment__top{
            margin-top:20px;
            width:100%;
        }
        .serviceComment__topText p{
            font-size:15px;
            line-height:25px;
            color:#080103;
            text-indent:2em;
        }
        .contactUS__header{
            height:110px;
        }
        .serviceComment__middle{
            margin-top:40px;
            
        }
        .serviceComment__middleList{
            width:33%;
            height:205px;
            cursor:pointer;
            display:block;
            float:left;
        }
        .middleList__title{
            height:40px;
            background-size:auto 100%;
            padding-left:70px;
            box-sizing:border-box;
            line-height:40px;
            font-size:17px;
            
        }
        .middleList__text{
            margin-top:15px;
            font-size:15px;
            line-height:25px;
            padding:0 20px 0 70px;
            box-sizing:border-box;
            color:#6e6e6e;
            height:75px;
        }
        .middleList__more{
            height:40px;
            padding-left:70px;
            box-sizing:border-box;
            font-size:13px;
            margin-top:10px;
            line-height:40px;
        }
        .middleList__moreWord{  
            width:75px;
            color:#6e6e6e;
            border-bottom:1px solid #e3e3e3;
            float:left;
        }
        .middleList__moreTri{
            color:#0698ec;
            float:left;
        }
        .serviceComment__middleList:hover .middleList__moreWord{
            border-bottom:1px solid #0698ec;
        }
        .middleList__domain{
            background-image:url(/Images/Service/icon-01.jpg);
        }
        .serviceComment__middleList:nth-child(2) .middleList__domain{
            background-image:url(/Images/Service/icon-02.jpg);
        }
        .serviceComment__middleList:nth-child(3) .middleList__domain{
            background-image:url(/Images/Service/icon-03.jpg);
        }
        .serviceComment__middleList:nth-child(4) .middleList__domain{
            background-image:url(/Images/Service/icon-04.jpg);
        }
        .serviceComment__middleList:nth-child(5) .middleList__domain{
            background-image:url(/Images/Service/icon-05.jpg);
        }
        .serviceComment__middleList:nth-child(6) .middleList__domain{
            background-image:url(/Images/Service/icon-06.jpg);
        }
        .serviceComment__middleList:nth-child(7) .middleList__domain{
            background-image:url(/Images/Service/icon-07.jpg);
        }
        .serviceComment__middleList:nth-child(8) .middleList__domain{
            background-image:url(/Images/Service/icon-08.jpg);
        }
        .serviceComment__middleList:nth-child(9) .middleList__domain{
            background-image:url(/Images/Service/icon-09.jpg);
        }
        .serviceComment__middleList:nth-child(10) .middleList__domain{
            background-image:url(/Images/Service/icon-10.jpg);
        }
        .serviceComment__middleList:nth-child(11) .middleList__domain{
            background-image:url(/Images/Service/icon-11.jpg);
        }
        .serviceComment__bottom{
            font-size:15px;
            line-height:25px;
            color:#080103;
            text-indent:2em;
            margin-top:20px;
            padding-bottom:30px;
        }
        .middleList__text:hover {
        color: #4BB4E7;
    }