@charset "utf-8";
/* CSS Document */

.ibanner{ height:860px; position:relative;}
.ibanner .txt{ display:none; width:816px; color:#fff; font-size:16px; text-align:center; position:absolute; left:50%; top:50%; z-index:3; transform:translate(-50%,-50%);}
.ibanner .txt h4{ line-height:1.36; font-size:2.75em;}
.ibanner .txt p{ line-height:2; padding:1.125em 0 0;}
.ibanner .swiper-slide{ display:block; height:100%; background:#000; 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); opacity/:0.6;}
.ibanner .swiper-slide-active .bg,
.ibanner .swiper-slide-duplicate-active .bg{ transition:transform 6s linear; transform:scale(1,1);}
.ibanner .swiper-pagination{ height:12px; bottom:30px;}
.ibanner .swiper-pagination-bullet{ width:12px; height:12px; background:#fff; border-radius:50%; opacity:0.4; margin:0 8px !important; vertical-align:top; transition:all ease 0.4s;}
.ibanner .swiper-pagination-bullet-active{ background:#549eff; opacity:1;}
.ibanner .swiper-button-prev,
.ibanner .swiper-button-next{ display:block; width:32px; height:32px; margin-top:-16px; background-size:contain !important;}
.ibanner .swiper-button-prev{ background:url(../images/icons/prev.png) center no-repeat; left:1.5%;}
.ibanner .swiper-button-next{ background:url(../images/icons/next.png) center no-repeat; right:1.5%;}

.main{ width:auto;}

.ibox{ position:relative; z-index:2;}
.ibox .con{ width:1200px; margin:0 auto;}
.ibox .con::before,
.ibox .con::after{ content:''; display:block; overflow:hidden; clear:both;}
.ibox h2.title{ display:block; font-size:16px; overflow:hidden; padding:3em 0;}
.ibox h2.title em{ display:inline-block; vertical-align:top; line-height:1.5; color:#333; font-size:1.5em; position:relative;}
.ibox a.more{ display:block; width:10em; line-height:2.75; color:#549eff; font-size:15px; text-align:center; border:2px solid #549eff; transition:all ease 0.4s; margin:0 auto;}
.ibox a.more:hover{ color:#fff; background:#549eff;}

.notice{ line-height:2.6em; color:#fff; font-size:15px; background:#549eff; padding:1.4em 0;}
.notice em{ display:block; font-size:1.2em; font-weight:bold; float:left; margin:0 1.75em 0 0;}
.notice .list{ height:2.6em; overflow:hidden; position:relative;}
.notice .list ul{ display:block; width:8000%; overflow:hidden; position:absolute; left:0;}
.notice .list ul li{ display:block; float:left; position:relative;}
.notice .list ul li a{ display:block; color:#fff; white-space:normal; margin:0 3em 0 0;}
.notice .list ul li a:hover{ text-decoration:underline;}

.box1{ padding:80px 0 80px;}
.box1 a.pic{ display:block; width:40%; float:left;}
.box1 a.pic img{ display:block; width:100%; height:360px; object-fit:cover;}
.box1 .r{ font-size:15px; overflow:hidden; padding:0 0 0 5%;}
.box1 a.title{ display:block; line-height:1.5; color:#333; font-size:1.6em; font-weight:bold; padding:0.75em 0 0;}
.box1 a.title:hover{ color:#549eff;}
.box1 p.desc{ display:block; line-height:1.5; color:#777; padding:1em 0 1.75em;}
.box1 i{ display:block; width:120%; height:10px; background:#549eff; margin:0 0 0 -20%;}
.box1 .txt{ line-height:2.25; color:#444; padding:1.25em 0 0;
	display:-webkit-box;
	display:-moz-box;
	overflow:hidden;
	text-overflow:ellipsis;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:4;
}
.box1 a.more{ margin:1.25em 0 0;}

.box2{ padding:20px 0 40px;}
.box2 ul{ display:block; font-size:16px; margin:0 -15px;}
.box2 ul::before,
.box2 ul::after{ content:''; display:block; overflow:hidden; clear:both;}
.box2 ul li{ display:block; width:33.33%; float:left;}
.box2 ul li a{ display:block; overflow:hidden; padding:0 0 0 20px; position:relative; margin:0 15px;}
.box2 ul li a img{ display:block; width:100%; height:480px; object-fit:cover;}
.box2 ul li a h4{ display:block; width:74%; line-height:5; color:#fff; font-weight:normal; position:absolute; left:0; bottom:18%; z-index:3;}
.box2 ul li a h4::before{ content:''; display:block; width:90%; height:100%; background:url(../images/icons/more.png) right center no-repeat; position:absolute; left:0; top:0; z-index:3; opacity:0; transition:all ease 0.4s;}
.box2 ul li a h4::after{ content:''; display:block; border:2.5em solid #549eff; border-width:2.5em 1.375em; border-color:#549eff transparent transparent #549eff; position:absolute; left:100%; top:0; z-index:1; transition:all ease 0.4s;}
.box2 ul li a h4 em{ display:block; padding:0 0 0 1.5em; background:#549eff; position:relative; z-index:2; transition:all ease 0.4s;}
.box2 ul li a h4 em::after{ content:''; display:inline-block; width:2em; height:2em; border:2px solid #fff; box-sizing:border-box; border-radius:50%; vertical-align:top; margin:2.5em 0 -2.5em 1em; transform:translateY(-50%); transition:all ease 0.4s;}
.box2 ul li a:hover h4::before{ opacity/:1;}
.box2 ul li a:hover h4::after{ border-color:#f6f6f6 transparent transparent #f6f6f6;}
.box2 ul li a:hover h4 em{ color:#f6f6f6; color:#549eff; background:#f6f6f6;}
.box2 ul li a:hover h4 em::after{ border-color:#f6f6f6; border-color:#549eff;}

.box3{ padding:0 0 80px;}
.box3 .flex{ display:flex; justify-content:space-between; padding:0 0 20px;}
.box3 ul{ display:block; width:50%; font-size:16px; overflow:hidden; position:relative;}
.box3 ul li{ display:block; width:50%; float:left;}
.box3 ul li a{ display:block; text-align:center; padding:10px 0; margin:0 0 48px;}
.box3 ul li a img{ display:block; height:5.375em; margin:0 auto 0.5em; transition:all ease 0.4s;}
.box3 ul li a b{ display:block; line-height:3; font-size:1.125em; font-weight:normal;}
.box3 ul li a span{ display:block; line-height:1.785; color:#777; font-size:0.875em; margin:0 24px;}
.box3 ul li a:hover img{ transform:translateY(-10%);}
.box3 .pic{ width:40%; flex-shrink:0;}
.box3 .pic img{ display:block; width:100%;}

.box4{ padding:0 0 20px;}
.box4 .video{ overflow:hidden; position:relative;}
.box4 .video video{ display:block; width:100%; height:100%; background:#000;}
.box4 .video .poster{ overflow:hidden; position:relative; z-index:1;}
.box4 .video .poster img{ display:block; width:100%; height:360px; object-fit:cover;}
.box4 .video em{ display:block; width:98px; height:98px; background:url(../images/icons/video.png) center no-repeat; background-size:contain; position:absolute; left:50%; top:150px; z-index:9; transform:translate(-50%,-50%); cursor:pointer; transition:all ease 0.4s;}
.box4 .video em:hover{ background-image:url(../images/icons/video_h.png);}
.box4 form.msg{ display:flex; justify-content:space-between; font-size:14px; background:#549eff; padding:38px 40px; border-radius:10px; position:relative; z-index:3; box-shadow:0 0 10px rgba(102,102,102,0.4); margin:-60px 0 0;}
.box4 form.msg label{ display:block; line-height:40px; color:#fff; flex-shrink:0; margin-right:10px;}
.box4 form.msg label font{ margin:0 0 0 4px;}
.box4 form.msg p{ display:block; flex:1; margin-right:38px;}
.box4 form.msg input.text{ display:block; box-sizing:border-box; width:100%; height:40px; line-height:2; color:#fff; padding:5px 12px; background:none; border:1px solid #fff;}
.box4 form.msg textarea{ display:block; box-sizing:border-box; width:100%; height:40px; line-height:2; color:#fff; padding:5px 12px; background:none; border:1px solid #fff; resize:none;}
.box4 form.msg ::placeholder{ color:rgba(255,255,255,0);}
.box4 form.msg input.btn{ display:block; width:82px; height:40px; color:#434343; border:0; background:#fff; cursor:pointer; flex-shrink:0; margin-left:-16px;}

.box5{ padding:0 0 60px;}
.box5 ul{ display:block; font-size:16px; overflow:hidden; margin:0 -12px; padding:0 0 40px;}
.box5 ul li{ display:block; width:25%; float:left;}
.box5 ul li a{ display:block; padding:20px; border:1px solid #e6e6e6; margin:0 12px 24px; transition:all ease 0.4s;}
.box5 ul li i{ display:block; margin:0.5em 0 2em;}
.box5 ul li i img{ display:block; max-width:100%; height:80px; margin:0 auto; transition:all ease 0.4s;}
.box5 ul li em{ display:block; line-height:1.5; color:#666; text-align:center; transition:all ease 0.4s;}
.box5 ul li p{ display:none;}
.box5 ul li a:hover{ border-color:#549eff;}
.box5 ul li a:hover i img{ transform:scale(1.1);}
.box5 ul li a:hover em{ color:#549eff; transform:translateY(-4px);}


@media only screen and (max-width:768px){

.ibanner{ height:62.5vw;}
.ibanner .txt{ width:calc(100% - 40px); font-size:13px; top:48%;}
.ibanner .swiper-pagination{ height:10px; bottom:16px;}
.ibanner .swiper-pagination-bullet{ width:10px; height:10px; margin:0 6px !important;}
.ibanner .swiper-button-prev,
.ibanner .swiper-button-next{ display:none;}

.ibox .con{ width:calc(100% - 30px);}
.ibox h2.title{ padding:2em 0; text-align:center; font-size:14px;}
.ibox a.more{ font-size:13px;}

.notice{ font-size:14px; padding:0.5em 0;}
.notice em{ font-size:15px;}

.box1{ padding:20px 0 40px;}
.box1 a.pic{ width:auto; float:none; margin:0 0 6px;}
.box1 a.pic img{ height:auto;}
.box1 .r{ font-size:13px; padding:0 6px;}
.box1 a.title{ font-size:16px;}
.box1 p.desc{ padding:0.6em 0 1.25em;}
.box1 i{ height:4px; margin:0 -10%;}
.box1 .txt{ line-height:1.75; padding:1em 0 0; -webkit-line-clamp:99;}

.box2{ padding:0 0 0;}
.box2 ul{ font-size:14px;}
.box2 ul li{ width:100%; margin:0 0 15px;}
.box2 ul li a{ padding:0;}
.box2 ul li a h4{ width:auto; line-height:4;}
.box2 ul li a h4::after{ border-width:2em 1.375em;}
.box2 ul li a h4 em::after{ width:1.5em; height:1.5em; margin:2em 0.5em -2em 1.5em;}
.box2 ul li a img{ height:auto;}

.box3{ padding:0 0 40px;}
.box3 .flex{ display:block;}
.box3 ul{ width:auto; font-size:14px;}
.box3 ul li{ width:100%;}
.box3 ul li a{ margin:0 0 16px;; padding:20px 0; background:#fafafa;}
.box3 ul li a img{ height:5em;}
.box3 ul li a span{ font-size:13px;}
.box3 .pic{ display:none;}

.box4{ padding:0 0 10px;}
.box4 .video .poster img{ height:180px;}
.box4 .video em{ width:56px; height:56px; top:50%;}
.box4 form.msg{ display:block; margin:0 -15px; border-radius:0; padding:24px 15px;}
.box4 form.msg label{ display:none;}
.box4 form.msg p{ margin:0 0 14px;}
.box4 form.msg input.text{ background:#fff; border-radius:20px; color:#333;}
.box4 form.msg textarea{ background:#fff; border-radius:20px; height:100px; color:#333;}
.box4 form.msg ::placeholder{ color:#666;}
.box4 form.msg input.btn{ width:100%; border-radius:20px; margin:0 auto; color:#549eff; font-size:15px;}

.box5{ padding:0 0 40px;}
.box5 ul{ font-size:14px; margin:0 -6px; padding:0 0 30px;}
.box5 ul li{ width:50%;}
.box5 ul li a{ padding:10px; margin:0 6px 12px;}
.box5 ul li i{ margin-bottom:1em;}
.box5 ul li i img{ height:60px;}


}





/**/