@charset "utf-8";
/* CSS Document */
*,*:before,*:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none !important; }
body{ margin:0px; padding:0px; font-size:12px;font-family: "微软雅黑";color:#000;line-height:1; background:#FFF;}
ul,li,dl,dd,dt,p,h1,h2,h3,h4,h5,h6,ol,form,input{ margin:0px; padding:0px;}
input,textarea { font-family: "微软雅黑"; border: none; outline: none; background: none; }
ul,li{ list-style:none}
img{border:0px; padding:0px; display: block;}
a{ color:#5c5c5c; text-decoration:none}

h2,h3,h4,h5,h6,h1,b,strong { font-weight: normal; }
em,i { font-style: normal; }

body{ background-color: #fff; min-width: 1200px; }

@keyframes sliderPagination {
    100% {transform: scaleX(1); opacity: 1;}
}
@font-face{
  font-family: 'myFont';
  src: url(BAHNSCHRIFT.TTF);
}

.clear{ zoom: 1; }
.clear:after { content: ''; display: block; clear: both; }
.fl { float:left}
.fr { float:right}
.hidden{display:none; background: url() no-repeat center;}


.header{ padding: 7px 0; }
.header .logoa{ display: block; width: 152px; }
.header .logoa img{ display: block; width: 100%; }

.banner{position: relative; overflow: hidden; width: 100%;}
.banner .pic{ display: block; width: 100%;}
.banner .pic img{ display: block;  width: 100%; }
.banner .uptxt{ position: absolute; left: 50%; top: 0; width: 1200px; margin-left: -600px; height: 100%; z-index: 3;display: flex; align-items: flex-start; justify-content: center; flex-direction: column; }
.banner .uptxt .tha{ font-size: 46px; color: #000; line-height: 1; }
.banner .uptxt .thb{ font-size: 26px; color: #666; line-height: 1; margin:36px 0; }
.banner .uptxt .goa{ display: block; width: 140px; height: 50px; background-color:#0574ea; border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 16px; color: #fff; transition: all 0.4s; }
.banner .uptxt .goa:hover{ border-radius: 50px; box-shadow: 0 0 3px #0574ea; }

.cont{ width: 1200px; max-width: 100%; margin:0 auto; }

.pagetab{ padding: 24px 0; border-bottom:1px solid #ededed;  }
.pagetab .tabs{ display: flex; align-items: center; justify-content: center; }
.pagetab .tabs a{ display: block; width: 142px; height: 50px; border-radius: 6px; margin:0 30px; cursor: pointer; font-size: 18px; color: #010101; transition: all 0.4s; line-height: 50px; text-align: center; }
.pagetab .tabs a.on{ background-color: #0574ea; color: #fff; }
.pagetab .tabs a:hover{ background-color: #0574ea; color: #fff; }

.sypart{ padding: 60px 0; }
.sypart .tit{ text-align: center; margin-bottom: 60px; display: flex; align-items: center; justify-content: center; }
.sypart .tit span{ font-size: 36px; color: #000; display: block; line-height:76px; position: relative; }
.sypart .tit span:after{ content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background-color: #0574ea; }
.sypart .libs{ margin-bottom: 30px; }
.sypart .libs .item{ float: left; width: calc(50% - 18px); margin-right: 36px;background-color: #ffffff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.11); border-radius: 6px; display: flex; align-items: center; justify-content: space-between; padding: 0 25px; height: 126px; margin-bottom: 24px; cursor: pointer; transition: all 0.4s; position: relative; overflow: hidden; }
.sypart .libs .item.on{ background-color: #0574ea; }
.sypart .libs .item:nth-child(2n){ margin-right: 0px; }
.sypart .libs .item .num{ position: absolute; right:55px; bottom: -38px; font-family: myFont; font-size: 112px; color: rgba(0,0,0,0.11); line-height: 1; transition: all 0.4s; min-width: 125px; text-align: center; }
.sypart .libs .item .icon{ display: block; width:64px; height: 64px; background: url(../img/a04.png) no-repeat center center / 100% 100%; transition: all 0.4s; }
.sypart .libs .item .go{ display: block; width:30px; height: 30px; background: url(../img/a02.png) no-repeat center center / 100% 100%; transition: all 0.4s; }
.sypart .libs .item p{ width: calc(100% - 140px); font-size: 18px; color: #000; line-height: 32px; transition: all 0.4s; }
.sypart .libs .item .icon.bg02{ background-image: url(../img/a05.png); }
.sypart .libs .item .icon.bg03{ background-image: url(../img/a07.png); }
.sypart .libs .item .icon.bg04{ background-image: url(../img/a09.png); }
.sypart .libs .item.on .icon.bg01{ background-image: url(../img/a03.png); }
.sypart .libs .item.on .icon.bg02{ background-image: url(../img/a06.png); }
.sypart .libs .item.on .icon.bg03{ background-image: url(../img/a08.png); }
.sypart .libs .item.on .icon.bg04{ background-image: url(../img/a10.png); }
.sypart .libs .item.on .go{ background-image: url(../img/a01.png); }
.sypart .libs .item.on p{ color: #fff; }
.sypart .libs .item.on .num{ color: rgba(255,255,255,0.11);}
.sypart .photo{ display: block; width: 100%; }
.sypart .photo img{ display: block; width: 100%; }
.sypart .photo .timg{ display: none; }

.footer{ text-align: center; padding: 30px 0; font-size: 15px; line-height: 20px; color:#666;  }

.loginbox{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; overflow: hidden; }
.loginbanner{ width: calc(100% - 620px); height: 100vh; float: left; position: relative; overflow: hidden; }
.bsswiper{ width: 100%; height: 100vh;}
.bsswiper .swiper-slide{ width: 100%; height: 100vh; margin: 0 !important; padding: 0 !important;}
.loginbanner .prev{ position: absolute; z-index: 1000; right:22px; bottom: 15vh; width: 53px; height: 49px; cursor: pointer; background: url(../img/pic4.png) no-repeat center center / 53px auto; }
.loginbanner .next{  position: absolute; z-index: 1001; right:19px;bottom: 9vh; width: 53px; height: 49px;  cursor: pointer; background: url(../img/pic3.png) no-repeat center center / 53px auto;}
.loginbanner .prev:hover{ background-image:url(../img/pic6.png);  }
.loginbanner .next:hover{ background-image:url(../img/pic5.png);  }
.bg1{ width: 80px; height: 100vh; background: url(../img/bg1.png) no-repeat; background-size: contain 100vh; background-position: top center; position: absolute; right: 0; top: 0; z-index: 999 }

.loginmain{ width: 620px; float: left; height: 100vh; background: url(../img/bg.png) no-repeat; background-size: contain 100vh; background-position: top center; z-index: 999; padding-top: 11vh; padding-bottom: 5vh; position: relative; }
.loginmain .logo{ width: 252px; height: 78px; margin: 0 auto; position: relative; left: -30px; }
.loginmain .login{ padding-top: 16vh; width: 428px; margin: 0 auto;}
.loginmain .login h2{ font-size: 22px; font-weight: bold; color: #0574ea;}
.loginmain .login ul{  margin-top: 20px;}
.loginmain .login ul li{ width: 428px; height: 54px; border-radius: 6px; background: url(../img/icon0_03.png) no-repeat #f6f6f6; background-size: 18px 18px; background-position: 20px center; padding-left: 54px; margin-bottom: 3vh;}
.loginmain .login ul li:last-child{ background: url(../img/icon0_04.png) no-repeat #f6f6f6; background-position: 20px center;}
.loginmain .login ul li input{ width: calc(100% - 92px); height: 54px; font-size: 16px; border: none; outline: none; }
.registerbtn{ display: block; width: 428px; height: 54px; border-radius: 6px; background:#0574ea; color: #fff; font-size: 18px; border: none; outline: none; cursor: pointer; }
.registerbtn:hover{ opacity: 0.9; }
.footer_p{ position: absolute; bottom: 3vh; left: 50%; transform: translateX(-50%); font-size: 12px; color: #888; text-align: center;  line-height: 24px; }