@charset "UTF-8";
.Hbanner,
.Hbanner .slick-slider,
.Hbanner .slick-list,
.Hbanner .slick-track,
.Hbanner .slick-slide{ height: 100%;}
.Hbanner img{ width: 100%; display: none;}
.Hbanner li{ position: relative;}
.Hbanner li figure{ position: relative; width: 100%; height: 100%;}
.Hbanner .txt{ left: 50%; max-width: 1440px; width: 96%; height: 100%; top: 0; position: absolute; z-index: 101; transform: translateX(-50%); color: #ecc471; }
.Hbanner .txt h3{ padding-top: 17%; font-size: 60px; letter-spacing: 2px; transform: translateY(0); font-weight: bold; }
.Hbanner .txt p{ font-size: 18px; margin-top: 2%; animation-delay:3s;-webkit-animation-delay:3s; transform: translateY(-150px);}
.Hbanner .txt *{ margin: 0; font-weight: normal; transition: all 1.4s; opacity: 0;}
.Hbanner .txt h3 span{ display: block;}
.Hbanner .txt h3 .span1{ animation-delay:2s;-webkit-animation-delay:2s; transform: translateY(-50px);}
.Hbanner .txt h3 .span2{ animation-delay:2.5s;-webkit-animation-delay:2.5s; transform: translateY(-80px);}
.Hbanner .slick-active .txt *{ transform: translateY(0); opacity: 1;}
.Hbanner .slick-active .txt .span1,
.Hbanner .slick-active .txt .span2{ transform: translateY(0);}
.Hbanner .slick-dots{ position: absolute; left: 0; bottom: 8%; text-align: center; z-index: 101; width: 100%; text-align: center;}
.Hbanner .slick-dots li{ display: inline-block; margin: 0 8px;}
.Hbanner .slick-dots button{ border: none; width: 15px; height: 15px; background: #fff; border-radius: 100%; font-size: 0;}
.Hbanner .slick-dots .slick-active button{ width: 43px; border-radius: 50px; background: #ff0000;}

@media(max-width:1200px){
    .Hbanner .txt h3{ font-size:40px; }
}
@media(max-width:1024px){
    .fp-tableCell,
    .fp-section.fp-table,
    .fp-slide.fp-table{ height: auto!important;}
    .Hbanner img{ display: block;}
    .Hbanner .txt{ display: none;}
}



.section{ background-size: cover;}
.Htitle{ text-align: center; font-size: 42px; margin: 40px 0; color: #fff; font-weight: bold;}
.Htitle p{ font-size: 20px; margin-top: 5px; font-weight: normal;}
.Hbox1 .fr{ width: 57.1%;}
.Hbox1_about{ color: #fff;}
.Hbox1_about article{ font-size: 18px; line-height: 36px;}
.Hbox1_num_ul{ margin-top: 7%;}
.Hbox1_num_ul li{ width: 20%; text-align: center; float: left; font-size: 16px;}
.Hbox1_num_ul li h3{ font-weight: normal;}
.Hbox1_num_ul li b{ font-size: 40px; color: #d80000; font-weight: bold; margin-right: 5px;}
.Hbox1 .fl{ width: 400px; background: url("../images/Hbox1_icon1.png") no-repeat center; height: 410px; text-align: center; position: relative;}
.Hbox1 .fl .txt{ width: 100%; text-align: center; left: 0; top: 53%; position: absolute; transform: translateY(-50%); color: #333333;}
.Hbox1 .fl p{ font-size: 16px; font-weight: bold; }
.Hbox1 .fl h3{ font-size: 22px; margin: -2% 0;}
.Hbox1 .fl h3 b{ font-size: 66px; color: #ff0000; font-family: Roboto;}
.Hbox1 .fl h4{ font-size: 28px; margin-top: 3%;}
.Hbox1 .fl li{ position: absolute; padding: 12px; background: rgba(194,176,148,0.3); border-radius: 100%; transition: all 0.5s;}
.Hbox1 .fl li img{ width: 70px; height: 70px; background: #aea89c; border-radius: 100%; transition: all 0.5s;}
.Hbox1 .fl .li1{left: 8%;top: 0;}
.Hbox1 .fl .li2{left: 68%;top: 1%;}
.Hbox1 .fl .li3{left: -9%;top: 55%;}
.Hbox1 .fl .li4{left: 49%;top: 84%;}
.Hbox1 .fl li:hover{ background: rgba(255,0,0,0.3); transform: rotateY(180deg);}
.Hbox1 .fl li:hover img{ background: #ff0000;}

.Hbox2{ position: relative; height: 100%;}
.Hbox2 .Htitle{ display: none;}
.Hbox2 .tit{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 10; width: 21.198%;}
.Hbox2 li{ width: 50%; background-position: center top; background-repeat: no-repeat; position: absolute; padding-top: 25.542%;}
.Hbox2 li figure img{ display: none;}
.Hbox2 li figure{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: center; background-size: cover; background-repeat: no-repeat;}
.Hbox2 li figure:before{ content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(9,18,31,0.3); transition: all 0.5s;}
.Hbox2 li.li1{ left: 0; top: 0;padding-top: 28.7%;}
.Hbox2 li.li1 figure{-webkit-mask: url(../images/Hbox2_libg1.png);-webkit-mask-size: cover;}
.Hbox2 .li2{ right: 0; top: 0;}
.Hbox2 .li2 figure{-webkit-mask: url(../images/Hbox2_libg2.png);-webkit-mask-size: cover;}
.Hbox2 .li2 figure:before{ background: rgba(0,71,157,0.5);}
.Hbox2 .li3{ left: 0; bottom: 0; padding-top: 39.55%;}
.Hbox2 .li3 figure{-webkit-mask: url(../images/Hbox2_libg3.png);-webkit-mask-size: cover;}
.Hbox2 .li3 figure:before{ background: rgba(12,25,45,0.6);}
.Hbox2 .li4{ right: 0; bottom: 0; padding-top: 39.55%;}
.Hbox2 .li4 figure{-webkit-mask: url(../images/Hbox2_libg4.png);-webkit-mask-size: cover;}
.Hbox2 .li4 figure:before{ background: rgba(0,0,0,0.3);}
.Hbox2 .li5{ left: 50.1%;transform: translateX(-50%);bottom: 0;padding-top: 23.55%;width: 33%;}
.Hbox2 .li5 figure{-webkit-mask: url(../images/Hbox2_libg5.png);-webkit-mask-size: cover;}
.Hbox2 .li5 figure:before{ background: rgba(0,0,0,0.2);}
.Hbox2 li .txt{ position: absolute; color: #fff; text-align: center; z-index: 10; max-width: 277px; top: 50%; transform: translateY(-50%);}
.Hbox2 li .txt h3{ font-size: 24px; margin: 2% 0;}
.Hbox2 li .txt p{ font-size: 16px; line-height: 28px;}
.Hbox2 .li1 .txt{ right: 11%; transform: translateY(-100%);}
.Hbox2 .li2 .txt{ left: 11%; transform: translateY(-85%);}
.Hbox2 .li3 .txt{ right: 20%;transform: translateY(-50%);}
.Hbox2 .li4 .txt{ left: 20%; transform: translateY(-50%);}
.Hbox2 .li5 .txt{ left: 50%; transform: translate(-50%,-10%);}
.Hbox2 li.aon figure:before{ opacity: 0;}

.Hbox3{ height: 100%; padding-top: 4%;}
.Hbox3 .Htitle{ color: #b7a17f;}
.Hbox3 .Htitle p{ color: #999999;}
.Hbox3 li{ display: inline-block; padding-left: 45px; position: relative;vertical-align: top; margin-right: 4.5%; }
.Hbox3 li:before,
.Hbox3 li:after{ content: ''; position: absolute;}
.Hbox3 li:before{ width: 30px; height: 30px; background: url("../images/icon_6.png") no-repeat center; left: 0; top: 0; z-index: 2}
.Hbox3 li:after{ width: 1px; height: 99%; top: 5px; left: 15px; background: #b8b8c1;}
.Hbox3 li h3{ font-size: 20px; color: #977e56;}
.Hbox3 li h3:after{ content: ''; display: block; width: 32px; height: 1px; background: #cfad83; margin: 10px 0;}
.Hbox3 li p{ font-size: 18px; color: #333333;}
.Hbox3 li h4{ color: #d60d10; font-size: 16px;}
.Hbox3 li h4 b{ font-size: 34px; font-family: Arial; margin-right: 5px;}


.Hbox3 .li1{padding-bottom: 8%;margin-top: 8.4%;}
.Hbox3 .li2{padding-bottom: 17%;margin-top: 1%;}
.Hbox3 .li3{padding-bottom: 4%;margin-left: -18%;margin-right: 7%;margin-top: 14.2%;}
.Hbox3 .li4{padding-bottom: 16%;margin-top: 8.8%;}
.Hbox3 .li5{padding-bottom: 4%;margin-left: -9%;margin-right: 1%;margin-top: 21.5%;}
.Hbox3 .li6{padding-bottom: 20.5%;margin-right: 0;margin-top: 5%;}
.Hbox3 .li7{padding-bottom: 5%;margin-right: 0;margin-left: -5%;margin-top: 19.5%;}

.Hbox4 ul{ max-width: 1285px; margin: 6% auto 0; width: 96%;}
.Hbox4 ul li{ width: 25%; float: left; background: rgba(229,187,96,0.9); position: relative; padding: 2% 2% 2% 6%;}
.Hbox4 ul li:first-child{ margin-left: 25%; margin-right: 50%; background: rgba(78,173,60,0.8);}
.Hbox4 ul li:nth-child(2){ margin-left: 50%; margin-right: 25%;}
.Hbox4 ul li:nth-child(4){ background: rgba(255,0,0,0.8); float: right;}
.Hbox4 ul li figure{ position: absolute; left: 0; top: 20%; width: 24%; text-align: center;}
.Hbox4 ul li a{ color: #fff;}
.Hbox4 ul li h3{ font-size: 30px; font-weight: normal;}
.Hbox4 ul li p{ font-size: 18px; line-height: 20px; height: 40px; overflow: hidden; margin-bottom: 5px;}
.Hbox4 ul li span{ font-size: 16px; position: relative; padding-bottom: 5px; display: inline-block;}
.Hbox4 ul li span i{ font-style: normal; display: inline-block; vertical-align: middle; font-family: 宋体; transition: all 0.5s;}
.Hbox4 ul li span:after{ content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: #fff; transition: all 0.5s;}
.Hbox4 ul li a:hover span i{ margin-left: 10px;}
.Hbox4 ul li a:hover span:after{ width: 100%;}

.Hbox5 .Htitle{ color: #d71718;}
.Hbox5 .Htitle:after{ content: ''; display: block; width: 25px; height: 25px; background: url("../images/Hbox5_icon1.png") no-repeat center; margin: 5px auto;}
.Hbox5 .top{ overflow: hidden;}
.Hbox5 .top li{ position: relative;}
.Hbox5 .top .slick-slide{ opacity: 0;}
.Hbox5 .top .slick-current{ opacity: 1;}
.Hbox5 .top .pic{ width: 50%; overflow: hidden;}
.Hbox5 .top .pic img{ transition: all 0.5s; width: 100%;max-height: 460px;object-fit: cover;}
.Hbox5 .top .pic:before{ content: ''; position: absolute; top: 33%; width: 40px; height: 4px; background: #f6bb2f; left: 48.4%;}
.Hbox5 .top .txt{ width: 45%; font-family: "Microsoft YaHei"; border-bottom: 3px solid #e7eef8; position: relative;}
.Hbox5 .top time{ font-size: 18px; font-style: oblique; color: #333; display: block;}
.Hbox5 .top time em{ font-size: 48px; display: block; font-weight: bold;}
.Hbox5 .top .tit{ font-size: 24px; line-height: 36px; height: 67px; overflow: hidden;margin: 7% 0 5%;display: block;}
.Hbox5 .top p{ font-size: 16px; line-height: 30px; color: #888888; height: 85px; overflow: hidden; margin-bottom: 21%;}
.Hbox5 .top .more{ padding-right: 42px; background: url("../images/icon_7.png") no-repeat right center; color: #d71718; position: absolute; left: 0; bottom: 0;line-height: 50px; transition: all 0.5s;}
.Hbox5 .top .more:after{ content: ''; position: absolute; left: 0; width: 0; height: 3px; background: #d71718; bottom: 0; transition: all 0.5s;}
.Hbox5 .top .txt:hover .more{ padding-right: 55px;}
.Hbox5 .top .txt:hover .more:after{ width: 100%;}
.Hbox5 .slick-dots{ width: 50%; position: absolute; left: 0; bottom: 5%; z-index: 101; text-align: center;}
.Hbox5 .slick-dots li{ display: inline-block; margin: 0 8px;}
.Hbox5 .slick-dots button{ width: 8px; height: 8px; border: none; background: #fff; border-radius: 100%; font-size: 0; padding: 0;}
.Hbox5 .slick-active button{ background: #d71718;}
.Hbox5 .list{ margin: 2.5% 0;}
.Hbox5 .list li{float: left;width: 24.25%;margin-right: 1%; font-family: "Microsoft YaHei";}
.Hbox5 .list li:last-child{ margin-right: 0;}
.Hbox5 .list li a{display: block;background:#f3f7fb;position: relative;padding: 7%;}
.Hbox5 .list li a:before{ content: ''; position: absolute; width: 20%; height: 63%; background: url("../images/icon_honor3.png") no-repeat center; background-size: contain; right: 0; bottom: 0;}
.Hbox5 .list li p,
.Hbox5 .list li h3{ position: relative; z-index: 2;}
.Hbox5 .list li span{ display: inline-block; padding: 0 8px; background: #d71718; border-radius: 50px; font-size: 12px; color: #fff;}
.Hbox5 .list li time{ float: right; color: #999999; font-size: 14px;}
.Hbox5 .list li h3{ font-size: 16px; line-height: 24px; color: #333; font-weight: normal; margin-top: 5%; overflow: hidden; height: 48px;}
.Hbox5 .list li a:hover{ background: #d71718; color: #fff;}
.Hbox5 .list li a:hover h3{ color: #fff;}
.Hbox5 .list li a:hover span{ background: #fff; color: #d71718;}
.Hbox5 .list li a:hover time{ color: #fff; opacity: 0.5;}
.Hbox5 .list li a:hover:before{ background-image: url("../images/icon_honor4.png");}
@media(max-width:1600px){
    .Hbox2 li{padding-top: 29.542%;}
    .Hbox2 li.li1{padding-top: 39.7%;}
}
@media(max-width:1400px){
    .Hbox2 li{padding-top: 36.542%;}
    .Hbox2 li.li1{padding-top: 61.9%;}
    .Hbox2 .li1 .txt{ top: 15%; transform: translateY(0);}
}
@media(max-width:1366px){
    .Hbanner .txt h3{ font-size: 48px;}
    .Htitle{ margin: 0 0 3%; font-size: 36px;}
    .Hbox2 li.li1 {padding-top: 51.9%;}
    .Hbox2 li {padding-top: 33.542%;}
    .Hbox2 .li1 .txt{ top: 4%;}
    .Hbox2 .li2 .txt{transform: translateY(0);top: 5%;}
    .Hbox2 li .txt h3{ font-size: 20px;}
    .Hbox3{ padding-top: 1%;}
    .Hbox3 li{margin-right: 1.5%;}
    .Hbox3 .li1{padding-bottom: 8%;margin-top: 8%;}
    .Hbox3 .li2{padding-bottom: 12.5%;margin-top: 1%;}
    .Hbox3 .li3{padding-bottom: 1%;margin-top: 11.2%;}
    .Hbox3 .li4{padding-bottom: 11.2%;margin-top: 4.8%;}
    .Hbox3 .li5{padding-bottom: 4%;margin-top: 14.5%;}
    .Hbox3 .li6{padding-bottom: 14%;margin-top: 5%;}
    .Hbox3 .li7{padding-bottom: 5%;margin-top: 12.5%;}
    .Hbox3 li h4 b{ font-size: 26px;}
    .Hbox4 ul{ margin: 0 auto;}
    .Hbox4 ul li{ padding-top: 1.5%; padding-bottom: 1.5%;}
    .Hbox4 ul li h3{ font-size: 24px;}
    .Hbox4 ul li p {font-size: 16px;line-height: 20px;height: 38px;overflow: hidden;}
    .Hbox5 .top .pic{ width: 41%;}
    .Hbox5 .top .pic:before{ left: 39.4%;}
    .Hbox5 .top .txt{ width: 54%; padding-right: 3%;}
    .Hbox5 .top time{ font-size: 16px;}
    .Hbox5 .top time em{ font-size: 38px;}
    .Hbox5 .top .tit{font-size: 20px;line-height: 30px;height: 33px;margin: 3% 0 2%;}
    .Hbox5 .top p{ margin-bottom: 18%;}
    .Hbox5 .list{ margin-top: 1%; padding-bottom: 2%;}
}
@media(max-width:1280px){
    .Hbox3 li{ margin-right: 1%;}
}
@media(max-width:1200px){
    .Hbox3 li{ margin-right: 1%;}
}
@media(max-width:1024px){
    #fp-nav{ display: none;}
    .Htitle{ font-size: 30px;}
    .Hbox1{ padding-bottom: 10%;}
    .Hbox1 .fl{ margin-top: 10%;}
    .Hbox1_about article{ font-size: 16px; line-height: 30px;}
    .Hbox1_num_ul li{ width: 33.33%; margin: 2% 0;}

    .Hbox2 .Htitle{ display: block; color: #b7a17f;}
    .Hbox2 .tit{ display: none;}
    .Hbox2 li{ position: relative; padding-top: 0!important; float: left; width: 33.33% !important; transform: none!important; left: 0!important;}
    .Hbox2 .li1,
    .Hbox2 .li2{ width: 50% !important;}
    .Hbox2 li figure{ position: static;-webkit-mask:none!important; padding-top: 80%;}
    .Hbox2 .li1 figure,
    .Hbox2 .li2 figure{ padding-top: 50%;}
    .Hbox2 li .txt{ width: 100%!important; top: 50%!important; left: 0!important; transform: translateY(-50%) !important; max-width: 100%; padding: 0 2%;}

    .Hbox3 li{ padding-bottom: 15% !important; margin: 0 2% 3% 0!important;}
    .Hbox3 li h4 b{ font-size: 30px;}
    .Hbox4{ padding-bottom: 5%;}
    .Hbox4 ul li h3{ font-size: 24px;}
    .Hbox4 ul li p{ font-size: 14px;}

    .Hbox5{ padding-bottom: 5%;}
    .Hbox5 .top time em{ font-size: 36px;}
    .Hbox5 .top .tit{ font-size: 20px; line-height: 30px; margin: 3% 0;}
}
@media(max-width:768px){
    .Hbox1 .fl,
    .Hbox1 .fr{ float: none;}
    .Hbox1 .fl{ margin: 3% auto;}
    .Hbox1 .fr{ width: 100%;}
    .Hbox3 li h3{ font-size: 18px;}
    .Hbox3 li h4 b{ font-size: 26px;}
    .Hbox4 ul li h3{ font-size: 18px;}
    .Hbox5 .top time{ font-size: 14px;}
    .Hbox5 .top time em{ font-size: 24px;}
    .Hbox5 .top .tit{ font-size: 16px; line-height: 24px; height: 50px;}
}

@media(max-width:640px){
    .Htitle{ font-size: 24px;}
    .Htitle p{ font-size: 16px;}
    .section{ background-position: center;}
    .Hbox1_about article,
    .Hbox2 li .txt p{ font-size: 14px; line-height: 24px;}
    .Hbox1_num_ul li b{ font-size: 20px;}
    .Hbox1_num_ul li{ font-size: 14px;}
    .Hbox1 .fl{ width: 86%; background-size: contain;}
    .Hbox1 .fl h3 b{ font-size: 30px;}
    .Hbox1 .fl h4{ font-size: 20px;}
    .Hbox2 li,
    .Hbox2 .li1,
    .Hbox2 .li2{ width: 100% !important;}
    .Hbox2 li figure,
    .Hbox2 .li1 figure,
    .Hbox2 .li2 figure{ padding-top: 0;}
    .Hbox2 li figure img{ display: block;}
    .Hbox2 li .txt h3{ font-size: 16px;}
    .Hbox3 li{ width: 100%;}
    .Hbox3 li h3{ font-size: 16px;}
    .Hbox3 li h4 b{ font-size: 24px;}
    .Hbox4 ul li{ width: 50%; margin: 0!important; padding-left: 15%;}
    .Hbox4 ul li h3{ font-size: 16px;}
    .Hbox4 ul li span{ font-size: 14px;}
    .Hbox5 .top .pic,
    .Hbox5 .top .txt{ width: 100%; float: none;}
    .Hbox5 .slick-dots{ position: relative; width: 100%; margin: 3% 0;}
    .Hbox5 .top p{ font-size: 14px; line-height: 24px; height: 75px;}
    .Hbox5 .list li{ width: 49%; margin-right: 2%; margin-bottom: 2%;}
    .Hbox5 .list li:nth-child(2n){ margin-right: 0;}
    .Hbox5 .list li h3{ font-size: 14px;}
}










