﻿@charset "utf-8";
.banner{ width:100%; height: 100vh; position:relative; overflow:hidden; box-sizing: border-box;}
.banner .swiper_banner{ width: 100%; height: 100%; position: relative; overflow: hidden;}
.banner .swiper-slide{ width:100%;  height: 100%; overflow:hidden; background:#fff;position: relative;overflow: hidden;}
.banner .swiper-slide a{  width: 100%; height: 100%; display: block; overflow: hidden;}
.banner .swiper-slide img{ width:100%; height: 100%; object-fit: cover; transform: scale(1.1); transition: all 15s linear;}
.banner .swiper-slide.swiper-slide-active img{transform: scale(1); }
.banner img.img01{ display:block}
.banner img.img02{ display:none}
.banner .swiper-slide .item{position: absolute;left: 0; top:32%;width: 100%; transform: translateY(-50%); color: #ffffff; z-index: 3;   }
.banner .swiper-slide .item .title{  font-size:48px;  position:relative; top:80px; transition:all 0.3s linear; opacity:0;  transition-delay:0.2s; width: 100%;  line-height: 1.2; font-weight: bold; text-align: center;}
.banner .swiper-slide .item .title i{ color: #070c30;}
.banner .swiper-slide .item .intro{ font-size:24px; margin-top:20px;position:relative; top:80px; transition:all 0.3s linear; transition-delay:0.4s; opacity:0; line-height: 1.4; text-align: center; }
.banner .swiper-slide.swiper-slide-active .item .title{ top:0; opacity:1}
.banner .swiper-slide.swiper-slide-active .item .intro{ top:0; opacity:1}
.banner .swiper_banner .pagination_banner{ position: absolute; left: 50%; bottom: 40px; z-index: 2; width: fit-content; display: flex; align-items: center; justify-content: center; margin-left: -780px; z-index: 2; height: 50px;}
.banner .swiper_banner .pagination_banner span{ display: block; width: 33px; height: 100%; border-radius: 0; background: url(g_03.png) center center no-repeat; background-size: 100%; opacity: 1; padding: 0; margin: 0; margin-right: 12px;}
.banner .swiper_banner .pagination_banner span.swiper-pagination-bullet-active{ background: url(g_04.png) center center no-repeat; background-size: 100%;}
.banner .swiper_banner .btn{ width: fit-content; display: flex; position: absolute; right: 50%; margin-right: -780px; bottom: 40px; z-index: 2;}
.banner .swiper_banner .btn .prev_banner{ width: 50px; height: 50px; cursor: pointer; background: url(g_05.png) center center no-repeat; background-size: cover; transform: rotate(180deg);}
.banner .swiper_banner .btn .next_banner{ width: 50px; height: 50px; cursor: pointer; background: url(g_05.png) center center no-repeat; background-size: cover; transform: rotate(0); margin-left: 15px;}
.banner .swiper_banner .btn .prev_banner:hover{ background: url(g_06.png) center center no-repeat; background-size: cover; transform: rotate(0);}
.banner .swiper_banner .btn .next_banner:hover{ background: url(g_06.png) center center no-repeat; background-size: cover; transform: rotate(180deg);}



@media only screen and (max-width:1600px){
    .banner .swiper-slide .item .title{  font-size:36px;}
    .banner .swiper-slide .item .intro{ font-size:19px; margin-top:20px;}
    .banner .swiper_banner .pagination_banner{ bottom: 25px; margin-left: -600px; height: 40px; }
    .banner .swiper_banner .pagination_banner span{ width: 25px;}
    .banner .swiper_banner .btn{ margin-right: -600px; bottom: 25px;}
    .banner .swiper_banner .btn .prev_banner{ width: 40px; height: 40px;}
    .banner .swiper_banner .btn .next_banner{ width: 40px; height: 40px;}
}
@media only screen and (max-width:1200px){
	.banner .swiper-slide .item .title{  font-size:28px;}
    .banner .swiper-slide .item .intro{ font-size:16px; margin-top:16px;}
    .banner .swiper_banner .pagination_banner{ bottom: 20px; margin-left: 0; left: 4%; height: 32px; }
    .banner .swiper_banner .pagination_banner span{ width: 18px; margin-right: 10px;}
    .banner .swiper_banner .btn{ margin-right: 0; right: 4%; bottom: 20px;}
    .banner .swiper_banner .btn .prev_banner{ width: 32px; height: 32px;}
    .banner .swiper_banner .btn .next_banner{ width: 32px; height: 32px;}
}
@media only screen and (max-width:750px){
	.banner .swiper-slide .item .title{  font-size:18px; line-height: 1.4;}
    .banner .swiper-slide .item .intro{ font-size:16px; margin-top:12px; }
    .banner .swiper_banner .pagination_banner{ height: 28px; }
    .banner .swiper_banner .btn .prev_banner{ width: 28px; height: 28px;}
    .banner .swiper_banner .btn .next_banner{ width: 28px; height: 28px;}

    .banner img.img02{ display:block}
    .banner img.img01{ display:none}
     
}

.brief{ height: 240vh; background: #070c30;}
.brief .pics {  position: sticky; top: 0; width: 100%; height: 100vh;}
.brief .picx { min-width: 70vw;  max-width: 100vw; max-height: 100vh; height: 20vw; min-height: 34vw; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden;}
.brief .picx img { width: 100%; height: 100%; object-fit: cover; border-radius:500px; transition: all 1.2s; -webkit-border-radius:500px; -moz-border-radius:500px; -ms-border-radius:500px; -o-border-radius:500px;}
.brief .picx video { width: 100%; height: 100%; object-fit: fill; border-radius: 500px; transition: all 1.2s; -webkit-border-radius: 500px; -moz-border-radius: 500px; -ms-border-radius: 500px; -o-border-radius: 500px;}
.brief .picx video.mm { display: none;}
.brief .picx.on img { border-radius: 0;}
.brief .picx.on video { border-radius: 0;}
.brief .picx video.mm {display: block !important; }


.brief .picx .btn {
display: block !important;
border-radius: 50%;
background-color: #fff;
width: 5vw;
min-width: 40px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.brief .picx .btn img {
position: relative;
z-index: 2;
}

.brief .picx .btn:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
border-radius: 50%;
width: 70%;
height: 70%;
animation: myfirstzx 1.5s linear infinite;
}


@media (max-width: 1200px){
    .brief .picx .mm{ border-radius: 0; -webkit-border-radius:0; -moz-border-radius:0; -ms-border-radius:0; -o-border-radius:0;}
	.brief{ height: auto;}
	.brief .picx video.mm {display: block !important;}
	.brief .pics {
	height: auto;
	position: static;
	width: 100%;
	}

	.brief .picx {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 45vw;
	border-radius: 0;
	transform: translate(0, 0);
	}

	.brief .picx video {
	border-radius: 0;
	}

	

	.parallaxw {
	width: 100% !important;
	height: 100% !important;
	}
	.brief{ margin-top: 0;}
	.brief .wap-none{ display: none;}
}
@keyframes myfirstzx {
    0% {
      transform: translate(-50%, -50%) scale(1);
      opacity: 0;
    }

    50% {
      transform: translate(-50%, -50%) scale(2);
      opacity: 0.8;
    }

    100% {
      transform: translate(-50%, -50%) scale(2.5);
      opacity: 0;
    }
}

.gcon_2{ width: 100%; background: #070c30; padding: 160px 0;}
.gcon_2 .ihd{ text-align: center; font-size: 48px; color: #f0cea3; position: relative; line-height: 1; width: 960px; margin: 0 auto; text-align-last: justify;}
.gcon_2 .ihd:after{ content: ""; display: block; width: 100%; height: 233px; background: url(g_07.png) center center no-repeat; background-size: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-70%);}
.gcon_2 .intro{ width: 960px; margin: 0 auto; margin-top: 30px; line-height: 2; font-size: 16px; color: #fefefe; text-align: center; padding-bottom: 45px; background: url(g_08.png) bottom center no-repeat; text-align: justify;}
.gcon_2 .more{ display: flex; align-items: center; justify-content: center; margin-top: 20px;}
.xmore a{ display: flex; align-items: center; justify-content: center; width: fit-content; padding: 15px; border-bottom: 1px solid #fff; font-size: 16px; color: #fff;}
.xmore a img{ display: block; margin-right: 10px; height: 26px;}
@media (max-width: 1600px){
    .gcon_2{ padding: 120px 0;}
    .gcon_2 .ihd{ font-size: 36px; width: 820px;}
    .gcon_2 .ihd:after{ height: 160px;}
    .gcon_2 .intro{ width: 820px; margin-top: 25px; font-size: 14px; padding-bottom: 35px; background-size: auto 15px;}
    .gcon_2 .more{ margin-top: 16px;}
    .xmore a{ padding: 12px; font-size: 14px;}
    .xmore a img{ margin-right: 10px; height: 20px;}

}
@media (max-width: 1200px){
    .gcon_2{ padding: 90px 0;}
    .gcon_2 .ihd{ font-size: 28px; width: 92%;}
    .gcon_2 .ihd:after{ height: 120px;}
    .gcon_2 .intro{ width: 92%; margin-top: 20px; font-size: 14px; padding-bottom: 30px; background-size: auto 12px;}
    .gcon_2 .more{ margin-top: 15px;}
    .xmore a{ padding: 12px; font-size: 14px;}
    .xmore a img{ margin-right: 10px; height: 16px;}
}
@media (max-width: 750px){
    .gcon_2{ padding: 60px 0;}
    .gcon_2 .ihd{ font-size: 24px; text-align-last: center;}
    .gcon_2 .ihd:after{ height: 90px; background-size: 100% 100%;}
    .gcon_2 .intro{ width: 92%; margin-top: 20px; font-size: 14px; padding-bottom: 30px; background-size: auto 12px;}
    .gcon_2 .more{ margin-top: 15px;}
    .xmore a{ padding: 12px; font-size: 14px;}
    .xmore a img{ margin-right: 10px; height: 16px;}
}


.gcon_3{ background: #070c30;}
.gcon_3 .ibd{ display: flex; flex-wrap: wrap; position: relative;}
.gcon_3 .ibd .imgs{ width: calc(968 / 1920 * 100%); border-top: 1px solid #fff;}
.gcon_3 .ibd .imgs .pic{ width: 100%;}
.gcon_3 .ibd .imgs .pic img{ width: 100%;}
.gcon_3 .ibd .imgs .pic .img1{ display: block;}
.gcon_3 .ibd .imgs .pic .img2{ display: none;}
.gcon_3 .ibd .imgs .cont{ width: fit-content; position: absolute; left: 50%; margin-left: -780px; top:0; z-index: 2; color: #fff; display: flex; justify-content: space-between; flex-direction: column; height: 100%; padding: 9.5% 0; box-sizing: border-box;}
.gcon_3 .ibd .imgs .cont .title{ font-size: 48px; color: #f0cea3; line-height: 1;}
.gcon_3 .ibd .imgs .cont .intro{ font-size: 16px; color: #fff; margin-top: 25px;}
.gcon_3 .ibd .rt{ width: calc(952 / 1920 * 100%) ; box-sizing: border-box; border-left: 1px solid #fff; border-bottom: 1px solid #fff;}
.gcon_3 .ibd .rt .swiper03{ width: 100%; box-sizing: border-box;height: 100%; overflow: hidden;}
.gcon_3 .ibd .rt .swiper03 .swiper-slide{ width: 40%; height: 100%; box-sizing: border-box; border-right: 1px solid #fff;}
.gcon_3 .ibd .rt .swiper03 .swiper-slide a{ display: block; width: 100%; box-sizing: border-box; padding: 0 25px;}
.gcon_3 .ibd .rt .swiper03 .swiper-slide .time{ font-size: 24px; color: rgba(255,255,255,0.25); writing-mode: vertical-rl; line-height: 1; }
.gcon_3 .ibd .rt .swiper03 .swiper-slide .title{ font-size: 22px; color:#fff;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2; line-height: 35px; height: 70px; margin-top: 25%; }
.gcon_3 .ibd .rt .swiper03 .swiper-slide .pic{ width: 100%; border-radius: 20px 0 0 0; overflow: hidden; margin-top: 12%;}
.gcon_3 .ibd .rt .swiper03 .swiper-slide .pic img{ width: 100%; transform: scale(1); transition: all 0.5s;}
.gcon_3 .ibd .rt .swiper03 .swiper-slide:hover .pic img{ transform: scale(1.1);}
.gcon_3 .ibd .rt .swiper03 .swiper-slide .intro{ font-size: 16px; line-height: 2; color: #fefefe; margin-top: 10%; overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;}
@media (max-width: 1600px){
    .gcon_3 .ibd .imgs .cont{ margin-left: -600px;}
    .gcon_3 .ibd .imgs .cont .title{ font-size: 36px; }
    .gcon_3 .ibd .imgs .cont .intro{ font-size: 14px; margin-top: 20px; width: 30vw;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide a{ padding: 0 20px;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .time{ font-size: 20px;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .title{ font-size: 18px; line-height: 30px; height: 60px; }
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .pic{ border-radius: 16px 0 0 0; }
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .intro{ font-size: 14px;}
}
@media (max-width: 1200px){
    .gcon_3 .ibd .imgs{ height: 25vh; overflow: hidden;}

    

    .gcon_3 .ibd .imgs .cont{ margin-left:0; left: 4%;}
    .gcon_3 .ibd .imgs .cont .title{ font-size: 28px; }
    .gcon_3 .ibd .imgs .cont .intro{ font-size: 14px; margin-top: 16px;  width: 100%;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide{ width: 40%;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide a{ padding: 0 20px;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .time{ font-size: 16px; writing-mode: horizontal-tb;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .title{ font-size: 16px; line-height: 30px; height: 60px; margin-top: 20px; }
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .pic{ border-radius: 16px 0 0 0; margin-top: 20px; }
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .intro{ font-size: 14px; margin-top: 15px;}
}
@media (max-width: 750px){
    .gcon_3 .ibd .imgs{ width: 100%; height: auto; position: relative;}
    .gcon_3 .ibd .imgs .pic .img2{ display: block;}
    .gcon_3 .ibd .imgs .pic .img1{ display: none;}
    .gcon_3 .ibd .imgs .cont{ margin-left:0; left: 4%;}
    .gcon_3 .ibd .imgs .cont .title{ font-size: 24px; }
    .gcon_3 .ibd .imgs .cont .intro{ font-size: 14px; margin-top: 16px;}
    .gcon_3 .ibd .rt{ width: 100%;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide{ width: 70%;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide a{ padding: 20px;}
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .time{ font-size: 14px; }
    .gcon_3 .ibd .rt .swiper03 .swiper-slide .title{ font-size: 16px; }
}

.gcon_4{ background: #070c30; padding: 160px 0; position: relative; overflow: hidden;}
.gcon_4 .ibd{ width: 736px; margin: 0 auto; background: #dfdbd8; box-sizing: border-box; padding: 70px 0; text-align: center; border-radius: 400px 400px 0 0 ; position: relative; z-index: 2;}
.gcon_4 .ibd .logo img{ height: 153px;}
.gcon_4 .ibd .p1{ margin-top: 40px; font-size: 48px; color: #85796a;}
.gcon_4 .ibd .p2{ font-size: 16px; color: #85796a; width: 420px; margin: 0 auto; margin-top: 20px; padding-bottom: 70px; background: url(g_15.png) bottom center no-repeat; background-size: auto 18px; }
.gcon_4 .ibd .p3{ margin-top: 50px;}
.gcon_4 .ibd .p3 a{ display: flex; align-items: center; justify-content: center; width: fit-content; height: 80px; box-sizing: border-box; padding: 0 90px; font-size: 20px; color: #070c30; font-weight: bold; margin: 0 auto; border-radius: 40px; border: 1px solid #070c30;}
.gcon_4 .ibd .p3 a img{ display: block; height: 26px; }
.gcon_4 .ibd .p3 a .i{ display: flex;}
.gcon_4 .ibd .p3 a .i i{ display: block; margin-left: 15px;}
.gcon_4 .picMarqueeLeft01{ width: 100%; position: absolute; left: 0; top:50%; transform: translateY(-50%);}
.gcon_4 .picMarqueeLeft01 .bd  ul li{ width: 172px;}
.gcon_4 .picMarqueeLeft01 .bd  ul li img{ width: 100%;}
@media (max-width: 1600px){
    .gcon_4{ padding: 120px 0;}
    .gcon_4 .ibd{ width: 600px; padding: 50px 30px; border-radius: 300px 300px 0 0 ;}
    .gcon_4 .ibd .logo img{ height: 120px;}
    .gcon_4 .ibd .p1{ margin-top: 30px; font-size: 36px;}
    .gcon_4 .ibd .p2{ font-size: 14px; width: 370px; margin-top: 20px; padding-bottom: 60px; background-size: auto 16px; }
    .gcon_4 .ibd .p3{ margin-top: 40px;}
    .gcon_4 .ibd .p3 a{ height: 70px; padding: 0 60px; font-size: 18px; }
    .gcon_4 .ibd .p3 a img{ height: 22px; }
    .gcon_4 .ibd .p3 a .i i{ margin-left: 13px;}
    .gcon_4 .picMarqueeLeft01 .bd  ul li{ width: 150px;}
}
@media (max-width: 1200px){
    .gcon_4{ padding: 100px 0;}
    .gcon_4 .ibd{ width: 500px; padding: 50px 30px; border-radius: 300px 300px 0 0 ;}
    .gcon_4 .ibd .logo img{ height: 100px;}
    .gcon_4 .ibd .p1{ margin-top: 30px; font-size: 28px;}
    .gcon_4 .ibd .p2{ font-size: 14px; width: 64%; margin-top: 20px; padding-bottom: 40px; background-size: auto 14px; }
    .gcon_4 .ibd .p3{ margin-top: 30px;}
    .gcon_4 .ibd .p3 a{ height: 60px; padding: 0 40px; font-size: 16px; }
    .gcon_4 .ibd .p3 a img{ height: 20px; }
    .gcon_4 .ibd .p3 a .i i{ margin-left: 12px;}
    .gcon_4 .picMarqueeLeft01 .bd  ul li{ width: 120px;}
}
@media (max-width: 750px){
    .gcon_4{ padding: 50px 0;}
    .gcon_4 .ibd{ width: 80%; padding:40px 0; }
    .gcon_4 .ibd .logo img{ height: 80px;}
    .gcon_4 .ibd .p1{ margin-top: 25px; font-size: 22px; padding: 0 5%;}
    .gcon_4 .ibd .p2{ font-size: 14px; width: 90%; margin-top: 16px; padding-bottom: 30px; background-size: auto 12px; }
    .gcon_4 .ibd .p3{ margin-top: 20px;}
    .gcon_4 .ibd .p3 a{ height: 50px; padding: 0 30px; font-size: 14px; }
    .gcon_4 .ibd .p3 a img{ height: 18px; }
    .gcon_4 .ibd .p3 a .i i{ margin-left: 10px;}
    .gcon_4 .picMarqueeLeft01 .bd  ul li{ width: 80px;}
}




































