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

/* banner */
.ibanner{ min-width:100vw; height:44vw; max-height:844px; position:relative;}
.ibanner .swiper-slide{ display:block; height:100%; background:#fff center no-repeat; background-size:cover; overflow:hidden; position:relative;}
.ibanner .swiper-slide .box{ height:100%; overflow:hidden; position:relative;}
.ibanner .swiper-slide .box .bg{ height:100%; background-size:cover !important; overflow:hidden; position:relative; z-index:1; transition:all ease 2s; transform/:scale(1.12);}
.ibanner .swiper-slide .box .bg img{ display:none; width:100%; height:auto;}
.ibanner .swiper-slide .box.on .bg{ transform:scale(1);}
.ibanner .swiper-slide .box .txt{ width:100%; line-height:1; color:#fff; font-size:56px; font-weight:bold; font-family:'思源黑体','思源黑体 CN'; text-align:center; letter-spacing:0.07em; text-shadow:0.09em 0.09em 1px rgba(0,0,0,0.1); position:absolute; left:0; top:45%; transform:translateY(-55%) scale(1,1.1); z-index:3;}
.ibanner .swiper-pagination{ display:block; height:30px; bottom:124px;}
.ibanner .swiper-pagination-bullet{ width:10px; height:10px; background:#fff; background-clip:content-box; padding:9px; border:1px solid transparent; border-radius:50%; opacity:1; margin:0 7px !important; vertical-align:top;}
.ibanner .swiper-pagination-bullet-active{ border-color:#fff; opacity:1;}
.ibanner .swiper-button-prev,
.ibanner .swiper-button-next{ display:none;}
.ibanner .swiper-slide img{ width:100%; height:auto; min-height:100%; transition:1s linear 2s; transform:scale(1.1,1.1);}
.ibanner .swiper-slide-active img,
.ibanner .swiper-slide-duplicate-active img{ transition:6s linear; transform:scale(1,1);}	

.main{ display:block;}

.ysBox ul{ display:block; font-size:16px; font-family:"思源黑体","思源黑体 CN"; overflow:hidden; background:#fff; box-shadow:0 0 17px 1px rgba(72,72,72,0.15); margin-top:-6.25em;}
.ysBox ul li{ display:block; width:25%; text-align:center; overflow:hidden; padding:2.75em 0; box-sizing:border-box; position:relative; float:left;}
.ysBox ul li::after{ content:''; display:block; width:1px; height:100%; background:#f4f4f4; position:absolute; left:0; top:0;}
.ysBox ul li:first-child::after{ display:none;}
.ysBox ul li img{ display:block; width:3em; position:absolute; right:10%; bottom:9%;}
.ysBox ul li em{ display:block; height:2em; line-height:2; color:#e41601; font-size:2em; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.ysBox ul li em b{ line-height:1; font-size:2em; font-family:Impact; font-weight:normal; padding-right:0.1875em;}
.ysBox ul li em sup{ display:inline-block; line-height:1; vertical-align:top;}
.ysBox ul li p{ display:block; line-height:1.6666; color:#999; font-size:1.125em; padding:1em 0 0;}

.ibox{ position:relative; z-index:2;}
.ibox::before,
.ibox::after{ content:''; display:block; overflow:hidden; clear:both;}
.ibox .con{ width:79vw; min-width:1200px; margin:0 auto;}
.ibox .con::before,
.ibox .con::after{ content:''; display:block; overflow:hidden; clear:both;}
.ibox h2.title{ display:block; line-height:1; font-size:18px; text-align:center; padding:3.55em 0 2.5em;}
.ibox h2.title em{ display:block; color:#333; font-size:2.11em;}
.ibox h2.title span{ display:block; color:#999; font-weight:normal; padding:1.4em 0 0; opacity:0.7;}
.ibox h3.title{ display:block; line-height:4em; font-size:32px; padding:0.875em 0 0;}
.ibox h3.title em{ color:#333;}
.ibox h3.title a{ display:block; color:#e41601; font-size:0.4375em; font-weight:normal; padding-right:1.72em; background:url(../images/icons/arrow_h.png) right center no-repeat; float:right;}
.ibox a.more{ display:block; width:11em; line-height:3; color:#fff; font-size:14px; text-align:center; background:linear-gradient(to left, #ef5922, #e31700); border-radius:1.5em; overflow:hidden; margin:5em auto; clear:both;}
.ibox a.more.hidden{ height:0; margin:0 auto 6em;}
.ibox a.more::after{ content:''; display:inline-block; vertical-align:top; width:1.65em; height:3em; background:url(../images/icons/arrow.png) right center no-repeat;}

.box1{ background:url(../images/icons/bg1.png) center no-repeat; background-size:cover;}
.box1 ul.tab{ display:flex; width:1280px; max-width:100%; overflow:hidden; margin:0 auto;}
.box1 ul.tab li{ display:block; width:50%; float:left;}
.box1 ul.tab li p{ display:flex; flex-direction:column; justify-content:center; width:calc(100% - 30px); height:7.5em; line-height:1; color:#333; font-size:14px; text-align:center; background:#f7f7f7; margin:0 auto; cursor:pointer;}
.box1 ul.tab li.cur p{ color:#fff; background:#e41601;}
.box1 ul.tab li p em{ display:block; line-height:1.32; font-size:1.572em;}
.box1 ul.tab li p span{ display:block; line-height:1.5; color:#999; opacity:0.7; padding:1em 0 0;}
.box1 ul.tab li.cur p{ color:#fff; background:#e41601;}
.box1 ul.tab li.cur p span{ color:#fff;}
.box1 .tbox ul{ display:none; overflow:hidden; margin:0 -16px; padding:76px 0 0;}
.box1 .tbox ul li{ display:block; width:33.33%; float:left;}
.box1 .tbox ul li a{ display:block; background:#000; font-size:15px; overflow:hidden; position:relative; transition:all ease 0.5s; margin:0 16px;}
.box1 .tbox ul li em.pic{ display:block; overflow:hidden;}
.box1 .tbox ul li em.pic img{ display:block; width:calc(100% + 10px); filter:blur(5px); opacity:0.5; margin:-5px; transition:all ease 0.5s;}
.box1 .tbox ul li span{ display:block; line-height:3; color:#fff; font-size:1.6em; letter-spacing:4px; text-align:center; position:absolute; left:50%; top:52%; transform:translate(-50%,-50%); z-index:1; transition:all ease 0.5s;}
.box1 .tbox ul li span img{ display:block; height:3.75em; margin:0 auto 0.7em;}
.box1 .tbox ul li .shade{ display:flex; flex-direction:column; justify-content:center; width:100%; height:100%; color:#fff; background:rgba(228,22,1,0.9); box-sizing:border-box; position:absolute; left:0; top:0; z-index:3; opacity:0; visibility:hidden; transition:all ease 0.5s;}
.box1 .tbox ul li .shade em{ display:block; line-height:1; font-size:1.6em; letter-spacing:4px; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.box1 .tbox ul li .shade em::after{ content:''; display:block; width:1.875em; height:3px; background:#fff; margin:1.5em auto; margin:6% auto;}
.box1 .tbox ul li .shade p{ display:block; width:24em; max-width:84%; height:4em; line-height:2; opacity:0.8; margin:0 auto;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}
.box1 .tbox ul li .shade i{ display:block; width:2.4em; height:2.4em; background:url(../images/icons/more.png) center no-repeat; background-size:contain; margin:2em auto 0; margin:4% auto 0;}

.box2{ overflow:hidden; padding:0 0 52px; position:relative;}
.box2 .bg{ width:100%; height:100%; position:absolute; left:0; top:0; z-index:1;}
.box2 .bg div{ display:none; width:100%; height:750px; background-size:cover !important; position:absolute; left:0; top:0;}
.box2 .con{ position:relative; z-index:3;}
.box2 h2.title em{ color:#fff;}
.box2 h2.title span{ color:#fff;}
.box2 a.more{ margin:0;}
.box2 .info{ display:none; line-height:1.5; color:#fff; font-size:17px;}
.box2 .info h4{ display:block; font-size:2.2em; letter-spacing:2px; padding:2em 0 0;}
.box2 .info p{ display:block; padding:1em 0 2.7em;}
.box2 ul.tab{ display:block; border:1px solid rgba(255,255,255,0.2); border-width:1px 0 0 1px; overflow:hidden; margin:120px 0 0;}
.box2 ul.tab li{ display:flex; align-items:center; width:33.33%; box-sizing:border-box; height:6.47em; color:#fff; font-size:17px; padding:0 4.5%; border:1px solid rgba(255,255,255,0.2); border-width:0 1px 1px 0; float:left; cursor:pointer;}
.box2 ul.tab li .icon {display:block; width:4em; height:4em; background-size:100% 100% !important; border-radius:50%; margin-right:1.65em; flex-shrink:0;}
.box2 ul.tab li::before{ content:''; display:block; width:4em; height:4em; background-size:100% 100% !important; border-radius:50%; margin-right:1.65em; flex-shrink:0;}
.box2 ul.tab li:nth-child(1)::before{ background:url(../images/icons/cls01.png) center no-repeat;}
.box2 ul.tab li:nth-child(2)::before{ background:url(../images/icons/cls02.png) center no-repeat;}
.box2 ul.tab li:nth-child(3)::before{ background:url(../images/icons/cls03.png) center no-repeat;}
.box2 ul.tab li:nth-child(4)::before{ background:url(../images/icons/cls04.png) center no-repeat;}
.box2 ul.tab li span{ display:block; line-height:1.65;}
.box2 ul.tab li.cur{ color:#e41601; background:#fff; background-clip:padding-box;}
.box2 ul.tab li.cur:nth-child(1)::before{ background-image:url(../images/icons/cls01_h.png);}
.box2 ul.tab li.cur:nth-child(2)::before{ background-image:url(../images/icons/cls02_h.png);}
.box2 ul.tab li.cur:nth-child(3)::before{ background-image:url(../images/icons/cls03_h.png);}
.box2 ul.tab li.cur:nth-child(4)::before{ background-image:url(../images/icons/cls04_h.png);}

.box3{ background:url(../images/icons/bg3.png) left center no-repeat; background-size:auto 100%;}
.box3 ul{ display:block; margin:0 16px; padding:38px 0 0;}
.box3 ul::before,
.box3 ul::after{ content:''; display:block; overflow:hidden; clear:both;}
.box3 ul li{ display:block; width:25%; float:left;}
.box3 ul li a{ display:block; font-size:16px; overflow:hidden; margin:0 16px; position:relative; transition:all ease 0.5s;}
.box3 ul li a img{ display:block; width:100%; transition:all ease 0.5s;}
.box3 ul li a em{ display:block; min-width:10em; line-height:2.35; color:#fff; font-size:0.875em; text-align:center; background:#1f40ba; padding:0 1em; position:absolute; left:0; top:0; z-index:5; transition:all ease 0.5s;}
.box3 ul li a span{ display:block; width:100%; box-sizing:border-box; line-height:3.55; color:#fff; font-size:1.125em; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:1em 1em 0; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); position:absolute; left:0; bottom:0; z-index:1; transition:all ease 0.5s;}
.box3 ul li a .shade{ display:flex; flex-direction:column; justify-content:center; width:100%; height:100%; color:#fff; text-align:center; background:rgba(0,0,0,0.7); padding:0 10%; box-sizing:border-box; position:absolute; left:0; top:0; z-index:3; opacity:0; visibility:hidden; transition:all ease 0.5s;}
.box3 ul li a .shade::after{ content:''; display:block; width:2.25em; height:2.25em; background:url(../images/icons/more.png) center no-repeat; background-size:contain; margin:1.6875em auto 0;}
.box3 ul li a .shade h4{ display:block; line-height:1.5; font-size:1.5em; font-weight:normal; margin:0 -5%; padding:0.6625em 0 0.5625em; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.box3 ul li a .shade p{ max-height:4em; line-height:2; font-size:0.875em; padding:1em 0 0;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
}

.box4{ background:url(../images/icons/bg4.jpg) center no-repeat; background-size:cover; padding:0 0 72px;}
.box4 .box{ width:48%; float:right;}
.box4 .box:first-child{ float:left;}
.box4 .box .video .poster{ background:#000; position:relative; overflow:hidden;}
.box4 .box .video{ overflow:hidden; position:relative; transition:all ease 0.5s;}
.box4 .box .video video{ display:block; width:100%; height:516px; background:#000; opacity:0.5;}
.box4 .box .video .poster em{ display:block; width:58px; height:58px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:9;}
.box4 .box .video .poster em::before,
.box4 .box .video .poster em::after{ content:''; display:block; 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 3s linear infinite; opacity:0;}
.box4 .box .video .poster em::after{ animation-delay:1.5s;}
.box4 .box .video .poster em i{ display:block; width:100%; height:100%; background:#fff 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);}
}
.box4 .box .video .poster.play video{ opacity:1;}
.box4 .box .video .poster.play em{ display:none;}
.box4 .box .video a{ display:block; line-height:1; color:#333; font-size:18px; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:1.6666em 1em 0; transition:all ease 0.5s;}

.box4 .box dl{ display:block; font-size:16px; margin:0 -20px;}
.box4 .box dl::before,
.box4 .box dl::after{ content:''; display:block; overflow:hidden; clear:both;}
.box4 .box dl dt{ display:block; width:50%; float:left;}
.box4 .box dl dt a{ display:block; overflow:hidden; margin:0 20px 36px; position:relative; transition:all ease 0.5s;}
.box4 .box dl dt a img{ display:block; width:100%; height:242px; object-fit:cover; transition:all ease 0.5s;}
.box4 .box dl dt a span{ display:block; width:100%; box-sizing:border-box; line-height:3.5; color:#fff; text-align:center; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding:6em 1em 0; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); position:absolute; left:0; bottom:0; z-index:1; transition:all ease 0.5s;}
.box4 .box dl dd{ display:block; line-height:4.875; padding:0 0.625em; overflow:hidden; clear:both; border-bottom:1px solid #ddd; margin:0 20px;}
.box4 .box dl dd:nth-child(3){ border-top:1px solid #ddd;}
.box4 .box dl dd span{ display:block; color:#999; overflow:hidden; float:right; margin-left:3em;}
.box4 .box dl dd a{ display:block; color:#444; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding-left:1.25em; position:relative; transition:all ease 0.5s;}
.box4 .box dl dd a::before{ content:''; display:block; width:4px; height:4px; background:#1f40ba; border-radius:50%; position:absolute; left:0; top:50%; margin-top:-2px;}

.box5{ background:url(../images/icons/bg5.png) center no-repeat; background-size:cover;}
.box5 .slider{ position:relative; z-index:1;}
.box5 .slider .bd{ position:relative; height:auto; z-index:0;}
.box5 .slider .bd .tempWrap{ margin:0 auto;}
.box5 .slider .bd ul{ display:block; overflow:visible !important;}
.box5 .slider .bd ul::after{ content:''; display:block; overflow:hidden; clear:both;}
.box5 .slider .bd ul li{ display:block; width:12.5%; float:left;}
.box5 .slider .bd ul li a{ display:block; background:#fff; border-radius:5px; box-shadow:0 0 15px rgba(0,0,0,0.1); margin:12px;}
.box5 .slider .bd ul li a img{ display:block; width:100%;}



@media only screen and (max-width:1600px){
.ibox h2.title{ font-size:13px;}
.ibox h3.title{ font-size:24px;}

.ysBox ul{ font-size:11px;}
.ysBox ul li p{ font-size:1.3em;}

.box1 ul.tab li p em{ font-size:1.4em;}
.box1 .tbox ul li a{ font-size:14px;}
.box1 .tbox ul li span{ font-size:1.285em;}

.box2 ul.tab li{ padding:0 3.2%; font-size:14px;}

.box4 .box .video video{ height:416px;}
.box4 .box .video a{ font-size:16px;}
.box4 .box dl{ font-size:14px;}
.box4 .box dl dt a img{ height:172px;}

}

@media only screen and (min-width:1025px){
.box1 .tbox ul li a:hover{ border-radius:4.5em 0;}
.box1 .tbox ul li a:hover em.pic img{ opacity:1;}
.box1 .tbox ul li a:hover span{ opacity:0;}
.box1 .tbox ul li a:hover .shade{ opacity:1; visibility:visible;}

.box3 ul li a:hover{ transform:translateY(-20px);}
.box3 ul li a:hover img{ transform:scale(1.08);}
.box3 ul li a:hover em{ background:#e41601;}
.box3 ul li a:hover span{ transform:translateY(100%);}
.box3 ul li a:hover .shade{ opacity:1; visibility:visible;}

.box4 .box dl dt a:hover img{ transform:scale(1.08);}
.box4 .box dl dd a:hover{ color:#e41601;}
.box4 .box dl dd a:hover::before{ background:#e41601;}
}

@media only screen and (max-width:1520px){
.ibanner{ height:680px;}
}

@media only screen and (max-width:1280px){
.ibox .con{ width:calc(100% - 40px); min-width:0;}
.ibanner{ height:53vw;}
}

@media only screen and (max-width:768px){
.ibanner{ height:auto;}
.ibanner .swiper-slide .box .bg img{ display:block;}
.ibanner .swiper-pagination{ height:18px; bottom:10px;}
.ibanner .swiper-pagination-bullet{ width:8px; height:8px; padding:4px;}

.ibox .con{ width:calc(100% - 24px); min-width:0;}
.ibox h2.title{ font-size:13px; padding:3em 0 2.25em;}
.ibox h3.title{ line-height:3.25em; font-size:24px; padding:0.325em 0 0;}
.ibox h3.title a{ font-size:0.5em;}
.ibox a.more{ font-size:12px; margin:2.75em auto;}

.ysBox ul{ font-size:13px; border:1px solid #f4f4f4; border-width:1px 0 0 1px; margin-top:1em;}
.ysBox ul li{ width:50%; padding:1.5em 0 1.5em; box-sizing:border-box; border:1px solid #f4f4f4; border-width:0 1px 1px 0;}
.ysBox ul li::after{ display:none;}
.ysBox ul li img{ width:2em; right:4%; bottom:6%;}
.ysBox ul li em{ height:1.5em; line-height:1.5; font-size:1.75em;}
.ysBox ul li em b{ font-size:1.5em;}
.ysBox ul li p{ line-height:1; padding:0.75em 0 0;}

.box1 ul.tab{ width:auto; max-width:none; margin:0 -6px;}
.box1 ul.tab li p{ width:auto; height:4em; font-size:13px; padding:0 0.5em; box-sizing:border-box; margin:0 6px;}
.box1 ul.tab li p em{ line-height:1.25; font-size:1em;}
.box1 ul.tab li p span{ display:none;}
.box1 .tbox ul{ padding:12px 0 0; margin:0 -3px;}
.box1 .tbox ul li a{ font-size:14px; margin:0 3px;}
.box1 .tbox ul li em.pic img{ height:150px; object-fit:cover;}
.box1 .tbox ul li span{ font-size:1em; white-space:nowrap; letter-spacing:0;}
.box1 .tbox ul li span img{ height:3.5em; margin-bottom:0.1em;}
.box1 .tbox ul li .shade{ display:none;}

.box2{ padding:0 0 40px;}
.box2 .info{ font-size:13px; /*background:linear-gradient(to bottom, rgba(255,255,255,0.3), rgba(255,255,255,0));*/ padding:0 1.25em 1.25em;}
.box2 .info h4{ font-size:1.75em; padding:0.9em 0 0;}
.box2 .info p{ padding:1em 0 2em;}
.box2 a.more{ margin:2px 0 0;}
.box2 ul.tab{ margin:10px 0 0;}
.box2 ul.tab li{ width:100%; height:5em; font-size:13px;}
.box2 ul.tab li::before{ width:3.5em; height:3.5em; margin-right:1.2em;}

.box3 ul{ padding:0; margin:-3px 9px;}
.box3 ul li{ width:50%;}
.box3 ul li a{ font-size:14px; margin:3px;}
.box3 ul li a em{ min-width:0; font-size:12px; padding:0 0.75em;}
.box3 ul li a span{ line-height:3; font-size:1em;}
.box3 ul li a .shade{ display:none;}

.box4{ padding:0 0 48px;}
.box4 .box{ width:auto; float:none !important;}
.box4 .box .video video{ height:auto;}
.box4 .box .video .poster em{ width:40px; height:40px;}
.box4 .box .video a{ font-size:14px;}
.box4 .box dl{ font-size:14px;}
.box4 .box dl dt{ width:auto; float:none;}
.box4 .box dl dt a{ margin:0 20px 10px;}
.box4 .box dl dt a img{ height:auto;}
.box4 .box dl dd{ line-height:4;}
.box4 .box dl dd:nth-child(3){ margin-top:14px;}
.box4 .box dl dd span{ margin-left:2em;}

.box5 h2.title span{ line-height:1.5; margin:0 1em;}
.box5 .slider{ width:1200px; margin:-10px 0; margin-left:50%; transform:translateX(-50%);}
.box5 .slider .bd ul li a{ margin:10px 4px;}

}

@media only screen and (min-width:1601px){
.ibox h2.title{ font-size:14px;}
.ibox h2.title em{ font-size:2em; letter-spacing:4px;}
}

@media only screen and (min-width:1281px){
.ysBox ul li em b{ font-size:1.85em;}
.ibox h3.title{ font-size:24px;}
.ibox h2.title em{ font-size:2.2em; letter-spacing:4px;}
}

@media only screen and (max-width:1280px){
.ibox h2.title em{ font-size:2em; letter-spacing:4px;}
}

@media only screen and (min-width:1600px){
.ysBox ul li em b{ font-size:44px;}
}

@media only screen and (min-width:1280px) and (max-width:1599px){
.ysBox ul li em b{ font-size:33px;}
}

@media only screen and (min-width:768px) and (max-width:1281px){
.ysBox ul li em b{ font-size:32px;}
}

@media only screen and (max-width:767px){
.ysBox ul li em b{ font-size:30px;}
}


























/**/