@charset "utf-8";
#banner { width: 100%; height: 700px; z-index: 1; left: 0; top: 0; }
#banner .swiper-container { height: 100%; }
#banner .swiper-wrapper { height: 100%; }
#banner .swiper-slide { width: 100%; height: 100%; }
#banner .swiper-slide>div.img { width: 100%; height: 100%; transform: scale(1.1); position: absolute; z-index: 2; left: 0; top: 0; background-size: cover; background-position: center top; background-repeat: no-repeat; transition: transform 15s; }
#banner .swiper-slide.normal>div.img { transform: scale(1); }
#banner .swiper-slide>div.con { position: absolute; z-index: 3; left: 425px; top: 42%; }
#banner .swiper-slide h1 { color: #fff; font-size: 4.2rem; font-weight: normal; display: block; margin: 0; transform: translateY(100px); opacity: 0; transition: all .5s ease; }
#banner .swiper-slide p { color: #fff; font-size: 2.8rem; font-weight: 300; margin-top: 15px; transform: translateY(100px); opacity: 0; transition: all .5s ease; }
#banner .swiper-slide.normal>div.con h1 { transform: translateY(0px); opacity: 1; transition: all .8s; }
#banner .swiper-slide.normal>div.con p { transform: translateY(0px); opacity: 1; transition: all .8s .2s; }
#banner .swiper-pagination { bottom: 30px; }
#banner .swiper-pagination-bullet { width: 8px; height: 8px; margin: 0 7px; opacity: 1; background: none; transition: all .25s; border: 2px solid #1885f5; }
#banner .swiper-pagination-bullet-active { width: 32px; opacity: 1; border-radius: 100px; background: #1885f5; }
 @media (max-width:1680px) {
#banner .swiper-slide>div.con { left: 125px; }
}
@media (max-width:1440px) {
#banner .swiper-slide>div.con { left: 100px; }
#banner .swiper-slide h1 { font-size: 4.8rem; }
}
@media (max-width:1366px) {
#banner .swiper-slide>div.con { top: 39%; }
#banner .swiper-slide>div.con { left: 80px; }
#banner .swiper-slide h1 { font-size: 3.6rem; }
#banner .swiper-slide p { font-size: 2.6rem; }
}
@media (max-width:1280px) {
#banner .swiper-slide>div.con { top: 40%; }
#banner .swiper-slide h1 { font-size: 3rem; }
#banner .swiper-slide p { font-size: 2rem; }
}
@media (max-width:1080px) {
#banner { height: 200px; }
#banner .swiper-slide>div.img { transform: scale(1.2); transition: transform 13s; }
#banner .swiper-slide>div.con { left: -70px; width: 100%; top: 42%; text-align: center; }
#banner .swiper-slide h1 { font-size: 1.6rem; }
#banner .swiper-slide p { font-size: 1.6rem; padding: 0 20px; margin-top: 5px; line-height: 1.3; }
#banner .swiper-pagination { bottom: 20px; }
#banner .swiper-pagination-bullet { width: 6px; height: 6px; margin: 0 5px; border: 1px solid #1885f5; }
#banner .swiper-pagination-bullet-active { width: 20px; }
}
/*       */
#m1 { margin: 0 auto; padding: 20px 0; }
#m1.container { width: 90%; max-width: 1080px; margin: 0 auto; }
.container .title { position: relative; margin: 50px auto; padding: 10px 0; text-align: center; font-size: 30px; color: #333; }
.container .title:after { position: absolute; z-index: 12; left: 50%; bottom: 0; margin-left: -20px; width: 40px; height: 1px; background: #0079C3; content: ''; }
#m1>ul { margin: 0 auto; }
#m1>ul>li { width: 24.6%; float: left; text-align: center; padding: 20px 0; transition: all .35s; border-left: 2px #9ED8F6 solid; border-bottom: 2px #9ED8F6 solid; }
#m1>ul>li:nth-child(4n) { border-right: 2px #9ED8F6 solid; }
#m1>ul>li .icon { margin: 0 auto; transition: transform .3s; }
#m1>ul>li .icon>img { height: 100px; width: auto; }
#m1>ul>li .tit { padding: 16px 0; font-size: 18px; color: #333; }
#m1>ul>li .num { font-size: 16px; color: #333; }
#m1>ul>li .num span { display: inline-block; color: #000; font-size: 32px; font-weight: bold; margin-right: 10px; }
#m1>ul>li:hover .icon { transform: translateY(-10px); }

@media (max-width:1080px) {
#m1>ul>li { width: 48.6%; }
#m1>ul>li .tit { height:30px; }
#m1>ul>li:nth-child(2n) { border-right: 2px #9ED8F6 solid; }
}

/*       */
#m2 { margin: 0 auto; padding: 20px 0; }
#m2.container { width: 90%; max-width: 1080px; margin: 0 auto; }
#m2>ul { margin: 0 auto; }
#m2>ul>li { width: 24%; margin: 0 0.5%; float: left; text-align: center; transition: all .35s; }
#m2>ul>li:nth-child(4n) { }
#m2>ul>li .img { margin: 0 auto; }
#m2>ul>li .img>img { width: 100%; width: auto; transition: transform .3s; }
#m2>ul>li .tit { padding: 16px 0; font-size: 16px; color: #333; }
#m2>ul>li:hover .img>img { transform: scale(1.08); }
@media (max-width:1080px) {
#m2>ul>li { width: 48%;}
}

/*       */
#m3 { width:100%; height: 800px; background-color: #D4E8F7; position: relative; z-index: 3; padding: 80px 0; }
#m3 .container { width: 90%; max-width: 1180px; margin: 0 auto; }
#m3 .wrap { overflow: hidden; height: 580px; position: relative; margin-top: 60px; }
#m3 .swiper-container { width: 100%; height: 100%; padding: 50px; box-sizing: border-box; }
#m3 .swiper-slide { height: 480px; transition: 600ms; transform: scale(0.88); background: rgba(0,0,0,.03); }
#m3 .swiper-slide>a { display: block; width: 100%; height: 100%; transition: all .3s; }
#m3 .swiper-slide-active, #m3 .swiper-slide-duplicate-active { transform: scale(1); background: #fff; box-shadow: 10px 10px 30px rgba(0,0,0,.1); }
#m3 .swiper-slide .img { height: 300px; overflow: hidden; background-size: cover; background-position: center; }
#m3 .swiper-slide .title { font-size: 1.9rem; color: #464646; padding: 35px 32px 0 32px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all .25s; }
#m3 .swiper-slide>a:hover { background: #0079C3; }
#m3 .swiper-slide>a:hover p { color: #fff; }
#m3 .ctrl { padding-left: 96px; }
#m3 .next, #m3 .prev { display: inline-block; }
#m3 .prev { transform: scaleX(-1); margin-right: 5px; }
#m3 .next i, #m3 .prev i { font-size: 3.6rem; color: #464646; transition: all .2s; }
#m3 .next:hover i, #m3 .prev:hover i { color: #1885f5; }
 @media (max-width:1680px) {
#m3 { padding: 80px 25px; }
}
@media (max-width:1440px) {
#m3 { padding: 70px 0; }
}
@media (max-width:1366px) {
#m3 .wrap { padding: 0 35px; }
#m3 .ctrl { padding-left: 80px; }
}
@media (max-width:1280px) {
#m3 { height: 760px; }
#m3 .wrap { margin-top: 45px; }
#m3 .swiper-slide .img { height: 265px; }
}
@media (max-width:1080px) {
#m3 { height: auto; padding: 40px 0; }
#m3 .wrap { height: auto; margin-top: 0px; padding: 0 0 20px 0; }
#m3 .swiper-container { width: 100%; height: 100%; padding: 20px 20px 30px 20px; box-sizing: border-box; margin-top: 50px; }
#m3 .swiper-slide { width: 100%; height: 450px; transition: 600ms; transform: scale(1); box-shadow: 10px 10px 30px rgba(0,0,0,.1); }
#m3 .ctrl { padding-left: 0; text-align: center; margin-top: 0px; padding-bottom: 30px; }
}
/*       */
#m4 { margin: 0 auto; padding: 20px 0 100px; }
#m4.container { width: 90%; max-width: 1080px; margin: 0 auto; }
.container .title { position: relative; margin: 50px auto; padding: 10px 0; text-align: center; font-size: 30px; color: #333; }
.container .title:after { position: absolute; z-index: 12; left: 50%; bottom: 0; margin-left: -20px; width: 40px; height: 1px; background: #0079C3; content: ''; }
#m4>ul { margin: 0 auto; }
#m4>ul>li { width: 19.6%; float: left; text-align: center; padding: 20px 0; transition: all .35s; border-left: 2px #9ED8F6 solid; border-bottom: 2px #9ED8F6 solid; }
#m4>ul>li:nth-child(5n) { border-right: 2px #9ED8F6 solid; }
#m4>ul>li .icon { width: 60%; margin: 0 auto; transition: transform .3s; }
#m4>ul>li .icon>img { width: 100%; }
#m4>ul>li .tit { width: 65%; height: 70px; line-height: 150%; margin: 0 auto; padding: 16px 0; font-size: 12px; color: #333; text-align:center; }
#m4>ul>li:hover .icon { transform: translateY(-10px); }
@media (max-width:1080px) {
#m4>ul>li { width: 48.6%; }
#m4>ul>li .tit { font-size: 14px; line-height:120%; }
#m4>ul>li:nth-child(2n) { border-right: 2px #9ED8F6 solid; }
#m4>ul>li:nth-child(4n) { border-right: 2px #9ED8F6 solid; }

}
