

.ptb3 {
    padding: 3% 0;
}

.boxbg, .effect-img span {
    background-size: cover;
    background-position: center center;
}
.HomeTit.tc {
    text-align: center;
}
.HomeTit {
    margin-bottom: 3%;
}
.HomeTit.whitetxt .name {
    color: #fff;
}
.HomeTit .name {
    display: block;
    font-size: 34px;
    line-height: 42px;
    color: #2d373c;
    font-weight: bold;
}

.HomeTit.whitetxt i {
    background: rgba(255, 255, 255, 0.3);
}
.HomeTit.tc i {
    margin: 16px auto 13px;
}
.HomeTit i {
    display: block;
    width: 30px;
    height: 2px;
    background: #00a0e9;
    margin: 16px 0px 13px;
}

.HomeTit.whitetxt p {
    color: rgba(255, 255, 255, 0.7);
}
.HomeTit p {
    font-size: 16px;
    color: #666;
    line-height: 24px;
}


.w1240 {
    max-width: 1540px;
    min-width: 320px;
    margin: 0px auto;
}
 
img {
    max-width: 100%;
    border: none;
    border: 0;
    vertical-align: top;
}

.HomeService {
    background-image: url(../images/boxbg3.jpg);
}
    
    .HomeService .mobile {
        display: none;
    }
    
    .HomeService .box {
        max-width: 1366px;
        min-width: 320x;
        margin: 0 auto;
        position: relative;
    }
    
    .HomeService .box .pic img {
        display: block;
        width: 100%;
    }
    
    .HomeService .box ul {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
    }
    
    .HomeService .box ul li {
        position: absolute;
        width: 15px;
        height: 15px;
    }
    
    .HomeService .box li.i1 {
        top: 30%;
        left: 78%;
    }
    
    .HomeService .box li.i2 {
        top: 20%;
        left: 15%;
    }
    
    .HomeService .box li.i3 {
        top: 44.5%;
        left: 27%;
    }
    
    .HomeService .box li.i4 {
        top: 42%;
        left: 37.5%;
    }
    
    .HomeService .box li.i5 {
        top: 44%;
        left: 38%;
    }
	
	.HomeService .box li.i6 {
        top: 20%;
        left: 26%;
    }
	
	.HomeService .box li.i7 {
        top: 16.5%;
        left: 13.5%;
    }
	
	.HomeService .box li.i8 {
        top: 22%;
        left: 12%;
    }
	
	.HomeService .box li.i9 {
        top: 26.1%;
        left: 9%;
    }
	.HomeService .box li.i10 {
        top: 45%;
        left: 35.3%;
    }
	.HomeService .box li.i11 {
        top: 81%;
        left: 14.5%;
    }
	.HomeService .box li.i12 {
        top: 34.5%;
        left: 42.3%;
    }
	.HomeService .box li.i13 {
        top: 34.5%;
        left: 45.5%;
    }
    .HomeService .box li.i14 {
        top: 73%;
        left: 44%;
    }
    .HomeService .box li.i15 {
        top: 84%;
        left: 54.7%;
    }
    
    .HomeService .box li.i16 {
        top: 21.5%;
        left: 75%;
    }
	.HomeService .box li.i17 {
        top: 40%;
        left: 79.5%;
    }
    .HomeService .box li.i18 {
        top: 63%;
        left: 95%;
    }
    .HomeService .box li.i19 {
        top: 84%;
        left: 87%;
    }
	
    
    .HomeService .box ul li .dot {
        border-radius: 50%;
        position: relative;
        width: 12px;
        height: 12px;
        border: 3px solid rgba(255, 255, 255, 0);
    }
    
    .HomeService .box ul li.i4 .dot span { 
        background: #033994; 
    }
    
    .HomeService .box ul li .dot span {
        display: block;
        position: relative;
        z-index: 2;
        background: #fff;
        width: 12px;
        height: 12px;
        border-radius: 50%;
    }
    
    
    
    .HomeService .box ul li .dot i {
        position: absolute;
        z-index: 0;
        background: rgba(255, 255, 255, 0.5);
        z-index: 1;
        width: 38px;
        height: 38px;
        left: 50%;
        top: 50%;
        border-radius: 50%;
        margin: -19px 0px 0px -19px;
        -webkit-animation: warn 3s ease-out;
        -moz-animation: warn 3s ease-out;
        animation: warn 3s ease-out;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }
    
    .HomeService .box ul li .hidebox {
        position: absolute;
        width: 343px;
        left: -30px;
        display: none;
        transition: 500ms;
		z-index:99;
    }
    
    .HomeService .box ul li .hidebox .more {
        display: block;
        width: 90px;
        height: 42px;
        background-color: #00a1ea;
        background-image: url(../images/arr3.png);
        background-repeat: no-repeat;
        background-position: center center;
    }
    
    .HomeService .box ul li.i1 .hidebox{
		width:208px;
	}
	
    .HomeService .box ul li.i2 .hidebox{
		width:208px;
	}
	
	.HomeService .box ul li.i3 .hidebox{
		width:208px;
	}
	
	.HomeService .box ul li.i6 .hidebox{
		width:208px;
	}
	
	.HomeService .box ul li.i7 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i8 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i9 .hidebox{
		width:208px;
	}

	.HomeService .box ul li.i11 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i12 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i13 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i14 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i15 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i16 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i17 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i18 .hidebox{
		width:208px;
	}
	.HomeService .box ul li.i19 .hidebox{
		width:208px;
	}
    .HomeService .box ul li .hidebox .con {
        border-top: 2px solid #00a0e9;
        background: #fff;
        padding: 15px;
        position: relative;
		overflow:hidden;
    }
    .HomeService .box ul li .hidebox .con .txtbox{
		width:48%;
		float:left;
	}
    .HomeService .box ul li .hidebox .con .effect-img {
       width:52%;
	   float:right;
       
    }
    .HomeService .box ul li .hidebox .con .effect-img span{
		height:98px;
	}
    
     @media ( max-width:1024px) {
		.HomeService .box ul li .hidebox .con .txtbox {
			width: 100%;
			float: none;
			margin-bottom: 5%;
		 }
		  .HomeService .box ul li .hidebox .con .effect-img {
			  width:100%;
			  float: none;
		  }
	 }
	
	.HomeService .box ul li .hidebox .con .title span {
        display: block;
        font-size: 20px;
        color: #2d373c;
        line-height: 39px;
    }
	
    .HomeService .box ul li .hidebox .con .title i {
        display: block;
        width: 20px;
        height: 1px;
        background: #d9d9d9;
    }
    
    .HomeService .box ul li .hidebox .con .info {
        margin-top: 5px;
        font-size: 14px;
        line-height: 24px;
        color: #2d373c;
    }
    
    .HomeService .box ul li .hidebox .arrow {
        width: 18px;
        height: 11px;
        position: absolute;
        bottom: -11px;
        left: 30px;
        background: url(../images/arr5.png);
    }
    
    .HomeService .box ul li:hover .dot {
        border: 3px solid #003e86;
    }
    
    a {
    color: #333;
    text-decoration: none;
    noline: -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
}


element.style {
}

.HomeService .box ul li.i4 .dot i { 
    background: #033994; 
}

.HomeService .box ul li .dot i {
    position: absolute;
    z-index: 0;
    background: rgba(255, 255, 255, 0.5);
    z-index: 1;
    width: 38px;
    height: 38px;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    margin: -19px 0px 0px -19px;
    -webkit-animation: warn 3s ease-out;
    -moz-animation: warn 3s ease-out;
    animation: warn 3s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
ul, li, form, dl, dt, dd, div, ul, li, h1, h2, h3, h4, h5, h6, p, em, i {
    padding: 0px;
    margin: 0px;
}
user agent stylesheet
i {
    font-style: italic;
}
user agent stylesheet
li {
    text-align: -webkit-match-parent;
}
user agent stylesheet
ul {
    list-style-type: disc;
}
style attribute {
    visibility: visible;
    animation-delay: 0.2s;
}
.wow {
    visibility: hidden;
}
body {
    margin: 0px;
    padding: 0px;
    margin: 0px auto;
    font-size: 12px;
    line-height: 24px;
    color: #666666;
    min-width: 320px;
    zoom: 1;
    background: #f5f5f5;
    font-family: frutigernext, "syrh", "Microsoft YaHei", Arial, Helvetica, sans-serif, Arial, "宋体";
    word-break: break-all;
}
.effect-img {
    text-align: center;
    cursor: pointer;
    zoom: 1;
    overflow: hidden;
}

.boxbg, .effect-img span {
    background-size: cover;
    background-position: center center;
}
.effect-img span {
    display: block;
    width: 100%;
    height: 100%;
}

.effect-img img, .effect-img span {
    opacity: 1;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
}

 /*公用样式*/
    
    .owl-carousel .owl-nav {
        height: 0px;
    }
    
    .effect-img {
        text-align: center;
        cursor: pointer;
        zoom: 1;
        overflow: hidden;
    }
    
    .effect-img img,
    .effect-img span {
        opacity: 1;
        -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
        transition: opacity 0.35s, transform 0.35s;
    }
    
    .effect-img:hover img,
    li:hover .effect-img img,
    dd:hover .effect-img img,
    .effect-img:hover span,
    li:hover .effect-img span,
    dd:hover .effect-img span {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1);
        transform: scale3d(1.1, 1.1, 1);
    }
    
    .wow {
        visibility: hidden;
    }
    
    .effect-img span {
        display: block;
        width: 100%;
        height: 100%;
    }
    
    @keyframes warn {
        0% {
            transform: scale(0);
            opacity: 0;
        }
        25% {
            transform: scale(0.8);
            opacity: 0.3;
        }
        50% {
            transform: scale(1.7);
            opacity: 0.8;
        }
        75% {
            transform: scale(0.8);
            opacity: 0.6;
        }
        100% {
            transform: scale(0);
            opacity: 0;
        }
    }
    
    @-webkit-keyframes warn {
        0% {
            transform: scale(0);
            opacity: 0;
        }
        25% {
            transform: scale(0.8);
            opacity: 0.3;
        }
        50% {
            transform: scale(1.7);
            opacity: 0.8;
        }
        75% {
            transform: scale(0.8);
            opacity: 0.6;
        }
        100% {
            transform: scale(0);
            opacity: 0;
        }
    }
    
    @-webkit-keyframes bounce-down {
        25% {
            -webkit-transform: translateY(-5px);
            opacity: 1;
        }
        50%,
        100% {
            -webkit-transform: translateY(0);
            opacity: 0.6;
        }
        75% {
            -webkit-transform: translateY(10px);
            opacity: 0.2
        }
    }
    
    @keyframes bounce-down {
        25% {
            -webkit-transform: translateY(-5px);
            opacity: 1;
        }
        50%,
        100% {
            -webkit-transform: translateY(0);
            opacity: 0.6;
        }
        75% {
            -webkit-transform: translateY(10px);
            opacity: 0.2;
        }
    }
    
    @keyframes move {
        0%,
        65% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }
        70% {
            -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
        }
        75% {
            -webkit-transform: rotate(-15deg);
            transform: rotate(-15deg);
        }
        80% {
            -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
        }
        85% {
            -webkit-transform: rotate(-15deg);
            transform: rotate(-15deg);
        }
        90% {
            -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
        }
        95% {
            -webkit-transform: rotate(-15deg);
            transform: rotate(-15deg);
        }
        100% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }
    }
    
    @-webkit-keyframes move {
        0%,
        65% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }
        70% {
            -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
        }
        75% {
            -webkit-transform: rotate(-15deg);
            transform: rotate(-15deg);
        }
        80% {
            -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
        }
        85% {
            -webkit-transform: rotate(-15deg);
            transform: rotate(-15deg);
        }
        90% {
            -webkit-transform: rotate(15deg);
            transform: rotate(15deg);
        }
        95% {
            -webkit-transform: rotate(-15deg);
            transform: rotate(-15deg);
        }
        100% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }
    }