@charset "utf-8";
/* CSS Document */

.ibanner{ width:100vw; height:650px; max-height:calc(100vh - 146px); position:relative;}
.ibanner .swiper-slide{ display:block; height:100%; overflow:hidden; position:relative;}
.ibanner .swiper-slide .box{ height:100%; overflow:hidden; position:relative;}
.ibanner .swiper-slide .bg{ width:100vw; height:100%; background-size:cover !important; position:absolute; left:0; top:0; z-index:2; transition/:1s linear 2s; transform/:scale(1.1,1.1);}
.ibanner .swiper-slide-active .box .bg,
.ibanner .swiper-slide-duplicate-active .box .bg{ transition/:6s linear; transform:scale(1,1);}
.ibanner .swiper-pagination{ height:12px; bottom:4%;}
.ibanner .swiper-pagination-bullet{ width:12px; height:12px; background:#fff; background-clip:content-box; border-radius:50%; opacity:1; margin:0 10px !important; vertical-align:top; transition:all ease 0.4s;}
.ibanner .swiper-pagination-bullet-active{ background:#e60012; opacity:1;}
.ibanner .swiper-button-prev,
.ibanner .swiper-button-next{ display:none; width:36px; height:124px; margin-top:-62px; background-size:contain !important;}
.ibanner .swiper-button-prev{ background:url(../images/icons/prev.png) center no-repeat; left:2.8%;}
.ibanner .swiper-button-next{ background:url(../images/icons/next.png) center no-repeat; right:2.8%;}

.main{ display:block; width:auto;}

.ibox{ position:relative; z-index:2;}
.ibox::before,
.ibox::after{ content:''; display:block; overflow:hidden; clear:both;}
.ibox .con{ width:1400px; margin:0 auto;}
.ibox .con::before,
.ibox .con::after{ content:''; display:block; overflow:hidden; clear:both;}
.ibox h2.title{ display:block; font-size:40px; text-align:center; padding:1em 0 0.875em;}
.ibox h2.title em{ display:block; line-height:2.5; color:#333; text-transform:uppercase;}
.ibox a.more{ display:block; width:11.285em; line-height:3.2; color:#999; font-size:14px; text-align:center; background:#f7f7f7; border:1px solid #e8e8e8; border-radius:1.65em; overflow:hidden; margin:4.35em auto; clear:both;}
.ibox a.more:hover{ color:#fff; background:#e60012; border-color:#e60012;}

.box1 .flex{ display:flex; align-items:flex-start;}
.box1 .video{ width:66.6%; height:524px; overflow:hidden; position:relative; margin:0 44px 0 0; flex-shrink:0;}
.box1 .video video{ display:block; width:100%; height:100%; background:#000;}
.box1 .video .poster{ width:100%; height:100%; background:#000; position:absolute; left:0; top:0; z-index:9;}
.box1 .video .poster em{ display:block; width:72px; height:72px; position:absolute; left:50%; top:50%; z-index:9; transform:translate(-50%,-50%); cursor:pointer;}
.box1 .video .poster em::before,
.box1 .video .poster em::after{ content:''; display:none; width:100%; height:100%; background:rgba(255,255,255,0.21); border-radius:50%; position:absolute; top:0; left:0; z-index:1; animation:playBtn 2s linear infinite; opacity:0;}
.box1 .video .poster em::after{ animation-delay:1s;}
.box1 .video .poster em i{ display:block; width:100%; height:100%; background:#000 url(../images/icons/video.png) center no-repeat; background-size:contain; border-radius:50%; position:relative; z-index:9; cursor:pointer;}
@keyframes playBtn{
	0%{ opacity:0; transform:scale(1);}
	20%{ opacity:1;}
	80%{ opacity:1;}
	100%{ opacity:0; transform:scale(2.2);}
}
.box1 .video .poster img{ display:block; width:100%; height:100%; object-fit:cover;}
.box1 .box{ flex-shrink:auto; font-size:16px;}
.box1 h4{ display:block; line-height:1.8; color:#333; font-size:1.25em; padding:0.5em 0 0;}
.box1 .txt{ line-height:1.75; color:#333; text-align:justify; overflow:hidden; padding:1.125em 0 0; max-height/:24.5em;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:999;
}

.box1 ul{ display:block; overflow:hidden; margin:0 -14px; padding:60px 0 0;}
.box1 ul li{ display:block; width:25%; float:left;}
.box1 ul li a{ display:block; line-height:1; font-size:16px; text-align:center; background:#eef1f7; padding:24px 0 30px; border-radius:10px; margin:0 14px;}
.box1 ul li a img{ display:block; height:2em; padding:10px 0; margin:0 auto;}
.box1 ul li a em{ display:block; line-height:2.625; color:#333; font-weight:bold;}
.box1 ul li a p{ display:block; line-height:1.75; color:#666; font-size:12px; padding:0 5em; text-transform:uppercase;}

.box2{ padding:0 0 50px;}
.box2 .con{ display:flex;}
.box2 p.tab{ display:flex; width:254px; flex-direction:column; justify-content:space-between; flex-shrink:0; padding-bottom:30px;}
.box2 p.tab a{ display:flex; width:100%; height:6.5em; color:#444; font-size:14px; background:#f6f6f6; border-radius:3.25em; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; transition:all ease 0.4s;}
.box2 p.tab a img{ display:block; height:34px; margin:0 auto 6px; transition:all ease 0.4s;}
.box2 p.tab a span{ display:block; line-height:1.2; text-align:center; padding:0 2em;}
.box2 p.tab a.cur{ color:#fff; background:#e60012;}
.box2 p.tab a.cur img{ filter:brightness(0) invert(1);}

.box2 ul.tbox{ display:none; font-size:16px; flex:auto; overflow:hidden;}
.box2 ul.tbox li{ display:block; width:33.33%; float:left;}
.box2 ul.tbox li .box{ overflow:hidden; padding:12px; border:1px solid #ededed; margin:0 0 30px 60px;}
.box2 ul.tbox li a.pic{ display:block; overflow:hidden;}
.box2 ul.tbox li a.pic img{ display:block; width:100%; height:216px; transition:all ease 0.4s;}
.box2 ul.tbox li a.title{ display:block; height:3.5em; line-height:1.75; color:#333; text-align:center; margin:1.25em 0 0; transition:all ease 0.4s;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}
.box2 ul.tbox li a.view{ display:block; width:8em; line-height:2; color:#fff; font-size:1.25em; text-align:center; text-transform:capitalize; background:#666; border-radius:1em; margin:0.8em auto; transition:all ease 0.4s;}
.box2 ul.tbox li .box:hover a.pic img{ transform:scale(1.05);}
.box2 ul.tbox li .box:hover a.title{ color:#e60012;}
.box2 ul.tbox li .box:hover a.view{ color:#fff; background:#e60012;}

.box3{ background:url(../images/icons/bg3.jpg) center no-repeat; background-size:cover; padding:0 0 80px;}
.box3 h2.title em{ color:#fff;}
.box3 ul{ display:block; overflow:hidden;}
.box3 ul li{ display:block; width:14.2857%; float:left;}
.box3 ul li img{ display:block; height:170px; border-radius:50%; margin:0 auto;}
.box3 ul li span{ display:block; line-height:2.8; color:#fff; font-size:20px; text-align:center; overflow:hidden;}

.box4 ul{ display:block; margin:-22px -22px 0;}
.box4 ul::before,
.box4 ul::after{ content:''; display:block; overflow:hidden; clear:both;}
.box4 ul li{ display:block; width:25%; float:left;}
.box4 ul li a{ display:block; overflow:hidden; border-radius:10px; box-shadow:0 12px 32px rgba(220,220,220,0.6); margin:22px;}
.box4 ul li img{ display:block; width:100%;}

.box5{ padding:0 0 80px;}
.box5 .coop{ font-size:16px; position:relative;}
.box5 .coop .swiper-container{}
.box5 .coop .swiper-slide{ display:block; height:100%; overflow:hidden; position:relative;}
.box5 .coop .swiper-slide a{ display:block; overflow:hidden; border:1px solid #f6f6f6; transition:all ease 0.4s;}
.box5 .coop .swiper-slide a img{ display:block; width:100%; transition:all ease 0.4s;}
.box5 .coop .swiper-slide a:hover{ border-color:#e60012;}
.box5 .coop .swiper-slide a:hover img{ transform:scale(1.1);}
.box5 .coop .swiper-button-prev,
.box5 .coop .swiper-button-next{ display:block; width:36px; height:36px; top:50%; margin-top:-18px; background-size:auto 55% !important; transition:all ease 0.4s;}
.box5 .coop .swiper-button-prev{ background:#7c7c7c url(../images/icons/prev.png) center no-repeat; left:0;}
.box5 .coop .swiper-button-next{ background:#7c7c7c url(../images/icons/next.png) center no-repeat; right:0;}
.box5 .coop .swiper-button-prev:hover,
.box5 .coop .swiper-button-next:hover{ background-color:#e60012;}




@media only screen and (max-width:1440px){

.ibanner{ height:558px;}

.ibox .con{ width:1200px;}
.ibox h2.title{ font-size:36px; padding:1em 0 0.75em;}

.box1 .video{ width:48%; height:384px;}
.box1 .txt{ -webkit-line-clamp:11; max-height:19.25em;}
.box1 ul li a p{ padding:0 2em;}

.box2 ul.tbox li .box{ margin:0 0 30px 30px;}
.box2 ul.tbox li a.view{ font-size:1.125em;}

.box3 ul li img{ height:146px;}
.box3 ul li span{ font-size:16px; line-height:3.5;}

}

@media only screen and (max-width:768px){

.ibanner{ height:42vw;}
.ibanner .swiper-pagination{ height:6px; bottom:5%;}
.ibanner .swiper-pagination-bullet{ width:6px; height:6px; margin:0 4px !important;}

.ibox .con{ width:calc(100% - 30px);}
.ibox h2.title{ font-size:22px;}

.box1 .flex{ display:block;}
.box1 .video{ width:auto; height:auto; margin:0;}
.box1 .video .poster em{ transform:translate(-50%,-50%) scale(0.6);}
.box1 .box{ font-size:14px;}
.box1 h4{ padding:1em 0 0;}
.box1 .txt{ max-height:none; -webkit-line-clamp:99; text-align:left; padding:0.5em 0 0;}
.box1 ul{ padding:20px 0 0; margin:0 -6px;}
.box1 ul li{ width:50%;}
.box1 ul li a{ font-size:14px; margin:0 6px 12px; padding:16px 0 6px;}
.box1 ul li a img{ padding:8px 0 4px;}
.box1 ul li a p{ padding:0 0.5em; font-size:12px; line-height:1.5; height:4.5em;}

.box2{ padding:0 0 40px;}
.box2 .con{ display:block;}
.box2 p.tab{ width:auto; margin:0; flex-direction:row; flex-wrap:wrap; padding:0 0 8px;}
.box2 p.tab a{ width:49%; border-radius:4px; font-size:12px; height:3.75em; margin:0 0 2%;}
.box2 p.tab a img{ display:none;}
.box2 p.tab a span{ padding:0 0.5em;}
.box2 ul.tbox{ margin:0 -6px; font-size:14px;}
.box2 ul.tbox li{ width:50%;}
.box2 ul.tbox li .box{ margin:0 6px 12px; padding:8px;}
.box2 ul.tbox li a.pic img{ height:auto;}
.box2 ul.tbox li a.title{ line-height:1.5; height:3em; margin:8px 0 0;}
.box2 ul.tbox li a.view{ font-size:13px;}

.box3{ padding:0 0 30px;}
.box3 ul{ display:flex; flex-wrap:wrap; justify-content:space-between;}
.box3 ul li{ width:30%; float:none;}
.box3 ul li:nth-child(7){ margin:0 35%;}
.box3 ul li img{ width:90%; height:auto; margin:0 auto;}
.box3 ul li span{ font-size:13px;}

.box4 ul{ margin:-7px;}
.box4 ul li{ width:50%;}
.box4 ul li a{ margin:7px; box-shadow:0 6px 16px rgba(220,220,220,0.6);}

.box5{ padding:0 0 40px;}
.box5 .coop{ padding:0 0 60px;}
.box5 .coop .swiper-button-prev,
.box5 .coop .swiper-button-next{ width:28px; height:28px; top:auto; margin:0; bottom:0;}
.box5 .coop .swiper-button-prev{ left:50%; margin-left:-40px;}
.box5 .coop .swiper-button-next{ right:50%; margin-right:-40px;}


}





/**/