@charset "utf-8";
/* CSS Document */


.w1200{ max-width:1400px; margin:0 auto;}
.flex{ display:flex; display: -webkit-flex; align-items:center;flex-wrap:  wrap ; justify-content:space-between}
.flex2{ display:flex; display: -webkit-flex; align-items:stretch;flex-wrap:  wrap ; justify-content:space-between}

.header { background:#fff; position:relative;}
.header .head{ background:#fff;}
.header .w1200{ position:relative; z-index:2;}
.header .bac{ background:#2778be; z-index:1; width:50%; position:absolute; right:0; top:0; height:100%;}
.header .head .logo img{ max-height:50px;}
.header  .pingtai{background:#2778be; padding:0 25px; color:#fff; width:155px;}
.header  .pingtai img{ vertical-align:middle; margin-right:15px;transition:all .3s;}
.header  .pingtai a{  color:#fff; font-size:16px; line-height:100px;}
.header  .pingtai a:hover img{ margin-right:8px; }

.main08box .swiper-wrapper{ align-items:stretch;}
.main08box .swiper-wrapper .swiper-slide{ background:#eee; height:auto;}

.banner{ position:relative;}
.banner >img{ display:block; width:100%; position:relative; z-index:1;}
.banner .txt{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:2;}
.banner .txt .w1200{ width:100%; height:100%; position:relative;}
.banner .txt b{ font-size:60px; color:#fff; font-weight:normal; line-height:1.3; display:block; margin-bottom:25px;}
.banner .txt p{ font-size:18px; color:#fff; text-transform:uppercase;}
.banner .txt .down{ cursor:pointer; position:absolute; bottom:100px; width:60px; height:60px; right:0; padding:10px;}
.banner .txt .down img{ width:100%;}
.banner .txt .down:after{ box-sizing:border-box; position:absolute; content:""; display:block; width:100%; height:100%; border:1px dashed #fff; border-radius:100%; left:0; top:0;  animation:zhuan 5s infinite linear;}

@keyframes zhuan{
    0%{ transform:rotate(0)}
    30%{transform:rotate(54deg)}
    60%{transform:rotate(108deg)}
    100%{transform:rotate(180deg)}
}

.main01{ padding:1.4rem 0 3.2rem;}
.indextit b{ font-size:36px; color:#2778be; font-weight:normal; position:relative; z-index:2;}
.indextit span{ font-size:72px; line-height:1; display:block; color:rgba(93,120,190,.08); z-index:1; position:absolute; left:0; top:-10px; text-transform:uppercase;}
.indextit{ position:relative; margin-bottom:70px;}

.main01 p{ width:60%; font-size:16px; color:#666666;}
.main01 .titles{ margin-bottom:35px; color:#000; font-size:24px;}


.main02{ padding:1.65rem 0; position:relative;}
.bac02{ position:absolute; height:100%; left:0; top:0; width:40%; background-image:url(../images/index22_06.png); background-size:cover; z-index:1;}
.main02 .w1200{ position:relative; z-index:2;}
.main02le ,.main02ri{ width:46%;}
.main02le img{ max-width:100%; margin:0 auto; display:block;}

.main2ribox p{ font-size:16px; color:#666666; line-height:2;}

.main03{ padding:1.4rem 0}
.main03 .indextit b{ color:#fff;}
.main03 .indextit span{ color:rgba(255,255,255,.1);}

.main03le{ width:57%;}
.main03ri{ width:41%;}
.main03le li{ width:48%; padding:10px; margin-bottom:20px; transition:all .3s; box-sizing:border-box; border:1px solid rgba(255,255,255,0)}
.main03ri img{ width:100%;}
.main03le li b{ color:#fff; font-size:20px; font-weight:normal;}
.main03le li p{ font-size:16px; color:#ffffff;}
.main03le li .txt{ width:calc(100% - 60px);}
.main03le li:hover{ padding-left:20px; border:1px solid #fff;}

.main03ri img{ display:block; max-width:100%;}


.main04{ padding:1rem 0;}
.main04 .indextit{ text-align:center;}
.main04 .indextit b{ width:100%;}
.main04 .indextit span{ width:100%;}


.main04{ background-size:cover; background-position: bottom center; background-repeat:no-repeat}
.main04tab{ margin-bottom:30px;}
.main04tab{ text-align:center;}
.main04tab a{ cursor:pointer; position:relative; padding:0 40px; line-height:50px; margin:0 25px; background:#2778be; color:#fff; font-size:18px; display:inline-block;}
.main04tab a img{ vertical-align:middle; margin-right:10px;}
.main04tab a.on:after{ top:100%; left:50%; content:""; display:block; width:21px; height:8px; background-image:url(../images/index_61.png); background-size:100% 100%; position:absolute; margin-left:-10px;}

.tapli{ display:none;}
.tapli .img{ width:calc(100% - 325px); padding:45px; background:#fff; height:500px; position:relative;}
.tapli .img img{ position:absolute; left:50%; top:50%; max-width:90%; max-height:90%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);}
.tapli .txt{ width:305px; padding-top:1rem;}
.tapli .txt p{ position:relative; padding-left:25px; font-size:16px; color:#000000; margin-bottom:10px;}
.tapli .txt p:before{ content:""; display:block; width:13px; height:13px; border:1px solid #2778be; border-radius:100%; position:absolute; left:0; top:6px;}

.main05{ padding:1.5rem 0}

.main05box{ padding-left:30%; position:relative;}
.main05box img{ position:absolute; left:0; max-width:25%; top:0; max-height:100%;}
.main05box li{ transition:all .3s; width:32%; padding:70px 30px; border-radius:5px; background-color:#f8f9f9; background-image:url(../images/index_72.png); background-position:bottom right; background-size:60% auto; background-repeat:no-repeat;}
.main05box li b{ margin-bottom:45px; font-size:24px; color:#2778be; font-weight:normal; display:block; line-height:1.5;}
.main05box li p{ font-size:16px; color:#666666; line-height:2;}
.main05box li:hover{ background-color:#2778be;}
.main05box li:hover b{ color:#fff;}
.main05box li:hover p{ color:#fff;}



.main06{ position:relative; padding:1.1rem 0; background:#f8f9f9;}
.main06 .bac{ width:40%; height:100%; background-image:url(../images/index22_16.png); background-size:cover; background-position:center; background-repeat:no-repeat; top:0; position:absolute; right:0; z-index:1;}
.main06 .w1200{ position:relative; z-index:2;}
.main6le,.main6ri{ width:48%;}
.main6ri img{ max-width:100%; display:block;}
 .main6le li b{ font-size:24px; color:#000 ; line-height:1; display:block; font-weight:normal; margin-bottom:15px;}
.main6le p{ font-size:16px; color:#666666;}
.main6le li{ margin-bottom:50px; border-left:3px solid #2778be; padding-left:20px;}


.main07 { padding:1.2rem 0; background:#f8f9f9;}
.main07 .indextit{ text-align:center;}
.main07 .indextit b{ width:100%;}
.main07 .indextit span{ width:100%;}




.item-hover {
    position: relative;
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}
.item-hover,
.item-hover * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.item-hover a {
    color: #333;
}
.item-hover a:hover {
    text-decoration: none;
}
.item-hover img {
    width: 100%;
    height: 100%;
}

.item-hover.circle {
    position: relative;
    width: 220px;
    height: 220px;
    border-radius: 50%;
}
.item-hover.circle .img {
    position: relative;
    width: 220px;
    height: 220px;
}

.item-hover.circle .img img {
}
.item-hover.circle .info {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}


.item-hover.circle.effect11 {
    -webkit-perspective: 900px;
    -moz-perspective: 900px;
    perspective: 900px;
}
.item-hover.circle.effect11 .img {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
	visibility:hidden;
}
.item-hover.circle.effect11.colored .info {
    background: rgba(21, 96, 130, 1);
}
.item-hover.circle.effect11 .info {
    background: #333333;
    opacity: 1;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s; 
    transition: all 0.4s;
}
.item-hover.circle.effect11 .info h3 {
    color: #fff;
    text-transform: uppercase;
    position: relative;
    letter-spacing: 2px;
    font-size: 22px;
    margin: 0 30px;
    padding: 55px 0 0 0;
    height: 110px;
    text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
}
.item-hover.circle.effect11 .info p {
     font-size:14px; color:#666666; line-height:1.5; margin-top:5px;
}
.item-hover.circle.effect11 a:hover .img {
    opacity: 1;
    visibility: visible;
}
.item-hover.circle.effect11 a:hover .info {
    opacity: 0;
}


.item-hover.circle.effect11.right_to_left .info {
    -webkit-transform: translateZ(0) rotateY(0);
    -moz-transform: translateZ(0) rotateY(0);
    -ms-transform: translateZ(0) rotateY(0);
    -o-transform: translateZ(0) rotateY(0);
    transform: translateZ(0) rotateY(0);
}
.item-hover.circle.effect11.right_to_left .img {
    -webkit-transform: translateZ(-1000px) rotateY(90deg);
    -moz-transform: translateZ(-1000px) rotateY(90deg);
    -ms-transform: translateZ(-1000px) rotateY(90deg);
    -o-transform: translateZ(-1000px) rotateY(90deg);
    transform: translateZ(-1000px) rotateY(90deg);
}
.item-hover.circle.effect11.right_to_left a:hover .info {
    -webkit-transform: translateZ(-1000px) rotateY(-90deg);
    -moz-transform: translateZ(-1000px) rotateY(-90deg);
    -ms-transform: translateZ(-1000px) rotateY(-90deg);
    -o-transform: translateZ(-1000px) rotateY(-90deg);
    transform: translateZ(-1000px) rotateY(-90deg);
}
.item-hover.circle.effect11.right_to_left a:hover .img {
    -webkit-transform: translateZ(0) rotateY(0);
    -moz-transform: translateZ(0) rotateY(0);
    -ms-transform: translateZ(0) rotateY(0);
    -o-transform: translateZ(0) rotateY(0);
    transform: translateZ(0) rotateY(0);
}


.main7le{ width:49%;}
.main7ri{ width:49%;}
.main7ri img{ width:100%; height:100%; object-fit:cover;}

.main7li{ background:#fff; padding:30px 0; min-height:200px; border-left:3px solid #2778be; position:relative;}
.main7li:nth-child(2){ margin-top:25px;}
.main7li .img{ width:40%;}
.main7li .img img{ margin:0 auto; display:block; max-width:80%;}
.main7li .txt{ font-size:20px; color:#000; width:58%;}
.main7li span{ position:absolute; bottom:0; right:0; font-size:1.3rem;  color:rgba(39,120,190,.05); line-height:1; display:block; font-weight:bold}


.main08{ padding:1.2rem 0}
.main08 .indextit{ text-align:center;}
.main08 .indextit b{ width:100%;}
.main08 .indextit span{ width:100%;}

.main08box .item-hover{ width:100%; min-height:300px; }
.main08box .item-hover .info{background:#f8f9f9 !important; padding:30px 30px;}
.main08box .item-hover.circle .img{ width:100%; height:100%;}
.main08box .item-hover.circle .img img{ width:100%; height:100%; object-fit:cover;}
.main08box .item-hover .info b{ font-size:22px; color:#2778be; font-weight:normal; display:block; margin-bottom:10px;}
.main08box .swiper-slide{ border-radius:5px ; overflow:hidden;}

.main08box  .item-hover.circle{ width:100%; height:100%;}
.main08box { padding-bottom:40px; position:relative;}
.main08box .swiper-pagination-bullet{ width:10px; height:10px; margin:0 5px;}

.main08box  .swiper-pagination{ bottom:0; width:100%; text-align:center;}

.footer{ padding:70px 0; background:#2778be;}
.fri{ width:285px;}
.fle{ width:calc(100% - 345px);}
.flogo{ width:300px;}
.ftxt{ width:calc(100% - 320px); padding-left:.95rem;}
.ftxt p { font-size:16px; color:#fff; margin:5px 0;}
.ftxt p span{ margin-right:40px; display:inline-block;}
.ftxt p a{ font-size:16px; color:#fff; display:inline-block;}
.fri li{ max-width:31%;}
.fri li img{ width:100%; display:block;}
.fri li span{ color:#fff; font-size:16px; margin-top:15px; display:block; text-align:center;}

.tc{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:10000;}
.tc img{ position:absolute; left:50%; top:50%; max-width:80%; max-height:80%; transform:translate(-50%,-50%);}

.img_fangda{ cursor:pointer;}
.main01{ background-size:63%; background-position:right bottom; background-repeat:no-repeat;}

@media screen and (max-width:1480px){
	 .w1200{ padding-left:40px; padding-right:40px;}
	 .banner .txt b{ font-size:40px;}
	 .banner .txt .down{ right:40px;}
	 .item-hover.circle.effect11 .info p{ font-size:14px;}
	 .indextit span{ font-size:52px;}
	 .indextit b{ font-size:30px;}
	 .main6le li b{ font-size:18px;}
	 .main2ribox p{ font-size:14px;}
	 .item-hover.circle.effect11 .info{ overflow:auto}
	 
	}
	@media screen and (max-width:960px){
	 .w1200{ padding-left:20px; padding-right:20px;}
	 
	 .main03le li p{ font-size:14px;}
	 .main04tab a{ margin:0 15px; padding:0 20px; font-size:14px;}
	 .tapli .img{ height:6rem;}
	 .tapli .txt p{ font-size:14px;}
	 .tapli .txt p:before{ top:4px;}
	 .indextit{ margin-bottom:40px;}
	 .main05box li b{ font-size:20px; margin-bottom:15px;}
	 .main05box li p,.main6le p{ font-size:14px;}
	 .main08box .item-hover .info{ padding:25px;}
	 .main08box .item-hover .info b{ font-size:18px;}
	 .fle{ width:100%;}
	 .fri{ margin:0 auto; margin-top:30px;}
	 .main05box li{ padding:20px;}
	 
	}
@media screen and (max-width:768px){
	.header .head .logo img{ max-height:35px;}
	.header .pingtai a{ line-height:60px;}
	.banner{ height:14rem; text-align:center;}
	.banner .txt .down{ right:20px; bottom:10px;}
	.banner .txt b{ font-size:20px;}
	.indextit b{ font-size:22px;}
	.main01,.main02,.main03,.main04,.main05,.main06,.main07,.main08{ padding:40px 0;}
	.indextit{ margin-bottom:20px;}
	.main01 .titles{ font-size:20px; margin-bottom:10px;}
	.main01 p{ font-size:14px; width:100%; background:rgba(255,255,255,.8); padding-right:15px; padding-bottom:15px;}
	.indextit span{ font-size:30px;}
	.main02le, .main02ri{ width:100%;}
	.bac02{ display:none;}
	.banner .txt p{ font-size:14px;}
	.banner img{ width:100%; height:100%; object-fit:cover;}
	.main02ri{ margin-top:20px;}
	.main03le,.main03ri{ width:100%;}
	.main03le li{ width:100%; margin-bottom:10px;}
	.main03le li b{ font-size:16px;}
	.main04tab a{ margin:6px 5px;}
	.tapli .txt{ width:100%;}
	.tapli .img{ width:100%; margin-top:15px; height:10rem;}
	.tapli .txt p{ margin-bottom:0}
	.main05box img{ position:static; max-width:50%; margin:0 auto; display:block;}
	.main6le, .main6ri{ width:100%;}
	.main05box{ padding:0}
	.main05box li{ width:100%; margin-bottom:10px;}
	.main06 .bac{ display:none;}
	.main6le li{ margin-bottom:20px;}
	.main7le,.main7ri{ width:100%;}
	.main7le{ margin-bottom:20px;}
	.main7li .txt{ font-size:16px;}
	.main7li span{ font-size:3rem;}
	.main7li{ padding:20px 0;}
	.flogo{ width:100%;}
	.flogo img{ max-width:150px;}
	.footer{ padding:40px 0;}
	.ftxt{ width:100%; padding:20px 0;}
	.ftxt p{ font-size:14px;}
	}
	
@font-face
{
font-family: siyuanheiti;
src: url('../fonts/SourceHanSansSC-Normal-2.otf')
}