html {
    height:100%;
}
body {
    font-family:宋体  !important;
    background-color:#e9e9e9;
    margin:0 auto;
    height:100%;
    background-color:white;
    font-size:12px;
}

.main {
    margin-left:auto;
    margin-right:auto;
    height:100%;
    min-height:100%;
    width:100%;
    background-color:white;

}
.skip-middle-line {
    text-decoration:line-through
}
.fleft {
    float:left
}
.font13 {
    font-size:13px;
}
.alignCenter {
    text-align:center;
}
/*===============================     Index   =============================================*/
.index-bg {
    height:100%;
    width:100%;
    background:url('/content/images/index-bg.png') no-repeat;
    background-size:cover;
}

.index-logo {
        top:50%;
    text-align:center;
    position:relative
}

    .index-logo img {
        width:100px;
    }


    .index-title {
        top:53%;
    text-align:center;
    position:relative;
    font-size:20px;
    color:#585756
}

        .index-icon {
        top:56%;
    text-align:center;
    position:relative
}
        .index-icon img {
            width:50px;
        }


/*===============================     Product   =============================================*/
.productindex-bg,.company-bg {
    width:100%;
    height:100%;
    margin-left:auto;
    margin-right:auto;
}
    .productindex-bg div,.productindex-to,.productindex-skip {
            margin-left:auto;
            margin-right:auto;
    }

.productindex-focus {
    height:250px;
    width:250px;
    border-radius:250px;
    background-color:white;
    position:relative;
    top:20%;
}

.productindex-focus-content {
    height:220px;
     width:220px;
    border-radius:220px;
    border:1px solid #e9e9e9;
    position:relative;
    top:15px;
    color:#616161;
    font-size:16px;
}
    .productindex-focus-content div {
        margin-top:100px;
        margin-left:40px;
    }
.productindex-to {
    position:relative;
    width:400px;
    left:8px;
    top:25%
}

.productindex-skip {
    position:relative;
    top:35%;
    width:100%;
    text-align:center
}

.productindex-p1{
    float:left;
    width:190px;
    margin-top:10px;
}
.productindex-p2 {
    float:left;
    width:190px;
    padding-left:10px;
    border-left:1px solid #979797;
}
.productindex-bg a {
    text-decoration:none;
    font-size:12px;
    color:#838383
}
.ProductA-bg,.ProductB-bg,.ProductEnd-bg {
    margin-top:0px;
    background:url('/content/images/product-2.png') no-repeat;

   width:350px;
   height:500px;
   margin-left:auto;
   margin-right:auto;

}
.ProductB-bg {
    background:url('/content/images/product-1.png') no-repeat;
   height:570px;
}

.ProductEnd-bg {
    background:url('/content/images/productEnd.png') no-repeat;
    background-size:200px;
    width:200px;
    margin-top:100px;
   height:570px;
}
.ProductA-title,.ProductB-title {
    width:100%;
    margin-top:70px;
    margin-bottom:50px;
    text-align:center;
    font-size:16px;
    color:#676767
}
.ProductA-bg > div,.ProductB-bg > div {
    position:absolute;
    color:white;
    font-size:14px;
    text-align:center;
    width:130px;
}
div[class$="-num"] {
    font-weight:bold;
    font-size:16px;
}
div[class$="-title"] {
    font-size:12px;
    font-weight:bold;
    margin-left:auto;
    margin-right:auto;
}
div[class$="-num"] i{width:15px;height:23px; display:inline-block; background: url('/content/images/number.png') no-repeat; background-position:0 0; text-indent:-999em}
.pa-1 {
    margin-left:223px;
    margin-top:154px;
}
.pai-1-title {
    width:90px;
}
.pa-2 {
    margin-left:44px;
    margin-top:215px;
}
.pai-2-title {
    font-size:12px;
    width:100px;
}

.pa-3 {
    margin-left:350px;
    margin-top:90px;
    width:100px;
}
    .pa-3 .pai-3-num {
        font-size:32px;
    }
.pa-3 .pai-3-title{
    font-size:12px;
    width:100px;
}

.pa-4 {
    margin-left:80px;
    margin-top:345px;
}
.pa-4 .pai-4-num {
        font-size:30px;
    }
.pa-4 .pai-4-title{
    font-size:11px;
    width:100px;
}
.pa-5 {
    margin-left:267px;
    margin-top:407px;
}
    .pa-5 div[class$="-num"] {
    font-size:28px;
    }
.pa-5 div[class$="-title"]{
    font-size:10px;
    width:70px;
}

.pa-6 {
    margin-left:105px;
    margin-top:125px;
}
   .pa-6 .pai-6-num{
    font-size:20px;
    }

.pa-6 .pai-6-title{
    font-size:10px;
    width:60px;
}


.ProductB-bg .pa-1 {
    margin-left:90px;
    margin-top:28px;
}

.ProductB-bg .pai-1-title {
    font-size:14px;
}
.ProductB-bg .pa-2 {
    margin-left:46px;
    margin-top:345px;
}
.ProductB-bg .pai-2-num{
    font-size:32px;
}
.ProductB-bg .pai-2-title{
    font-size:12px;
    width:90px;
}

.ProductB-bg .pa-3 {
    margin-left:430px;
    margin-top:374px;
}


.ProductB-bg .pai-3-title{
    font-size:12px;
    width:80px;
}
.ProductB-bg .pai-3-num {
    font-size:26px;
}

.ProductB-bg .pa-4 {
    margin-left:290px;
    margin-top:60px;
}
.ProductB-bg .pai-4-title{
    font-size:11px;
    width:70px;
}
.ProductB-bg .pai-4-num {
    font-size:22px;
}

.ProductB-bg .pa-5 {
    margin-left: 320px;
    margin-top: 150px;
}

.ProductB-bg .pa-5 .pai-5-num {
    font-size: 20px;
}

.ProductB-bg .pa-5 .pai-5-title {
    font-size: 10px;
    width: 65px;
}
/*===============================     Company   =============================================*/
.company-bg {
    background-color:white
}
.company {
    height:440px;
    position:absolute;
    top:45%;
    margin-top:-250px;
    width:700px;
    left:50%;
    margin-left:-350px;
    color:#808080;
    line-height:22px;
}
.company-menu {
    width:200px;
    height:100%;
    background-color:black;
    overflow:hidden;
    position:absolute;
    display:none;
    z-index:100;
}
.company-menu-logo {
    padding-left:0px;
    text-align:center;
    padding-top:30px;
}

.company-menu .company-closemenu, .company-closemenu-hiden,.company-openmenu {
    font-size: 12px;
    width: 20px;
    height: 100%;
    background-color: red;
    text-align:center;
    vertical-align:middle;
    float:right;
    width:10px;
    overflow:hidden;
    cursor:pointer;
    color:white;
    z-index:100;
}
.company-menu > div {
    padding-left:20px;
    line-height:50px;
    border-bottom:1px solid #363837;
    font-size:13px;
}

    .company-menu div a {
        color:#b5b5b5;
        text-decoration:none;
    }

.company-openmenu  {
    top:-45px;
    height:29px;
    width:15px;
    font-size:12px;
    vertical-align:middle;
    padding-top:19px;
    margin-top:250px;
    border-radius:0;
    position:absolute;
}

.company-content {
    float:left;
    width:650px;
   margin-top:100px;
   margin-left:150px;
}

/*===============================     About   =============================================*/
.About-top-1,.About-top-2 {
    height:27px;
    width:100%;
    background-color:#202221;
}

.About-top-2 {
    background-color:#3b3d3c;
    text-align:center;
    color:white;
    font-size:12px;
}
    .About-top-2 span {
        display:inline-block;
        margin-top:5px;
    }

.About-bg {
    background-color:#4d4d4d;
    height:100%
}

.about-content {

    color:#929292;
    font-size:12px;

}
    .about-content div[tag="about"] {
        display: none;
        width: 1000px;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left:-500px;
    }

.about-text {
    padding-top:35px;
    padding-bottom:35px;
    line-height:25px;
}
.butbodyl {
    position:relative;
    top:0;
    left:0px;
    width:62px;
}
.butbodyr {
    position:relative;
    top:30%;
    left:60%;
    width:62px;
}

.buttonleft,.buttonright {
    width:62px;
    height:62px;
    border-radius:62px;
    border:1px solid #929292;
    color:#929292;
    font-size:40px;
    cursor:pointer;
    margin-top:200px;
    position:absolute;
    top:50%;
    margin-top:-32px;
    left:38px;
}

.buttonright {
    left:100%;
    margin-left:-100px
}
    .buttonleft span,.buttonright span {
        display:inline-block;
        margin-left:18px;
        margin-top:12px;
    }
    .buttonright span {
        margin-left:22px;
    }
    .buttonleft :hover, .buttonright :hover {
    border-color:white;
    color:white;
    }

.about-arc {
    display:inline-block;
    height:60px;
    width:60px;
    border-radius:60px;
    background-color:black;
    color:white;
    font-size:40px;
}

    .about-arc :first-child {
        margin-top:10px;
    }
.icon1,.icon2,.icon4,.icon3{
    background:url(/content/images/icons.png) no-repeat;
    padding-left:25px;
    background-size:15px;
    background-position-y:3px;
}

.icon1{
    background-position-y:-41px;
}
.icon2{
    background-position-y:-21px;
}

.icon4{
    background-position-y:-64px;
}
/*===============================     Case   =============================================*/
.Case-bg {
    background-color:white
}

div[class^=case] {
    vertical-align:middle
}

div[class^=case] *{
    display:inline
}
.case1 {
    height:100%
}
.case1 img{
    width:100%
}

.case2 {
    height:600px;
    overflow:hidden
}

    .case2 img {
        height:600px;
    }



#imgHistory {
    position:relative;
    left:0; 
}
.caseUp {
    width:100%;
    text-align:center;
    position:absolute;
    top:5%;
    z-index:100;
}
.caseDown {
    width:100%;
    text-align:center;
    position:absolute;
    top:87%;
    z-index:100;
}
    .caseDown img, .caseUp img {
        width:100px;
        height:100px;
        cursor:pointer;
    }

.case3 table {
    border-spacing:0px
}
.case3 td{
    width:33.33%
}
    .case3 td img {
        width:100%
    }

#memo {
    color: white;
    position: absolute;
    background-color: black;
    vertical-align:middle
}
/*===============================     Teach   =============================================*/
.teach-bg {
    background-color:#202221;
}
.teach-logo {
    background-color:white;
    padding-top:20px;
    height:40px;
    padding-bottom:50px;
    padding-right:30px;
    padding-top:50px;
}

.teach {
    width:19%;
    margin-right:5px;
}

    .teachlist {
        margin-top:50px;
    }
    .teach a {
        text-decoration:none;
    
    }

.teach-img,.teach-img img {
    width:100%;
}

.teach .teach-title {
    color:#7a7a7a;
    font-size:500%
}

.teach .teach-content {
    margin-top:30px;
    text-align:center;
    line-height:30px;
}

.teach-content span{
    color:white;
    font-size:12px;

}

    .teach-content :first-child {
        font-size:18px;
        font-weight:bold
    }

/*===============================     ServiceMap   =============================================*/
.service-logo {
    background-color:#4d4d4d;
    height:100px;
    text-align:right;
    width:100%
}

.service-logo td{
    background:url('/content/images/service-logo.jpg');
    width:333px;
    height:58px;
}
.service-list {
    overflow:hidden;
    width:100%;
}
    .service-list table {

    }


.socialButton {
    position:absolute;
    height:0px;
    top:50%;
    margin-top:0px;
    width:100%
}
.socialPrv .buttonleft, .socialNext .buttonright {
    margin-top:0px;
}
.socialPrv,.socialNext {
    float:left;
    position:relative;
    height:65px;
}

.socialNext {
    float:right;
    margin-right:20px;
}